100% Width and Align Center Problem [Archive]

may_bailey

05-29-2012, 04:39 PM

Hello,

I use generally simple layout like..

In my <body> I start with a <section> for a full table and go on adding <article id="top_part"> for logo - menu

and then another <section> part for the content part and goes on...

My question is :

1) When I arrange the width of my first section to 100% it leaves blank space on top and left side. Also the right side flows over the browser a bit.

2) When I arrange my sub sections or article which are under my first section to have margin:0 auto; they are not centered. They have {float:left; border:0; margin:0 auto;}

Why are not they centered?

Cheers

Major Payne

05-30-2012, 02:50 PM

1/2) Can't center an element with 100% width or a float set.

Without code used (HTML/CSS), hard to tell you what would fix blank spaces.

Examples:body {
width: 90%;
height: 600px; /* optional */
margin: 0 auto;
background: #fff url(path to non-tiled image) no-repeat center scroll;
}

Example as a Class:

.selector_name {
width: 90%;
height: 600px; /* optional */
margin: 0 auto;
background: #fff url(path to non-tiled image) no-repeat center scroll;
}

HTML for Class: <div class="selector_name">Content here</div>