SyntaxFix

[css] Center Div inside another (100% width) div

The key is the margin: 0 auto; on the inner div. A proof-of-concept example:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<body>
    <div style="background-color: blue; width: 100%;">
        <div style="background-color: yellow; width: 940px; margin: 0 auto;">
            Test
        </div>
    </div>
</body>
</html>

Examples related to css

• need to add a class to an element • Using Lato fonts in my css (@font-face) • Please help me convert this script to a simple image slider • Why there is this "clear" class before footer? • How to set width of mat-table column in angular? • Center content vertically on Vuetify • bootstrap 4 file input doesn't show the file name • Bootstrap 4: responsive sidebar menu to top navbar • Stylesheet not loaded because of MIME-type • Force flex item to span full row width

Examples related to xhtml

• How to refresh table contents in div using jquery/ajax • Uses for the '&quot;' entity in HTML • The entity name must immediately follow the '&' in the entity reference • Can I save input from form to .txt in HTML, using JAVASCRIPT/jQuery, and then use it? • How to vertically align a html radio button to it's label? • Image height and width not working? • Removing border from table cells • Enable & Disable a Div and its elements in Javascript • how to remove the bold from a headline? • How to make div occupy remaining height?