[Solved] Centering section

[VladimirKrstic]

Hello,

I need little CSS help here – http://vkxx.netii.net/ . How can i achieve that my section element stays perfectly centered? You can see problem low width devices or by lowering browser width.

Thanks in advance.

[Paulie_D]

Which section is to be centered? You have some sections inside other sections?

You seem to be wrapping the whole page in a section which is clearly not correct.

[VladimirKrstic]

Yes, i’m wrapping whole page inside section. What would be correct? And yes i wan’t this section… whole page centered.

[Paulie_D]

The page wrapping element should, ideally be a div.

The ‘definition’ of section..

In this context, a section is a thematic grouping of content, typically with a header, possibly with a footer. Examples include chapters in a book, the various tabbed pages in a tabbed dialog box, or the numbered sections of a thesis. A web site’s home page could be split into sections for an introduction, news items, contact information.

It’s not the whole page….as you are doing here.

More in a moment..

[VladimirKrstic]

Thank you, I knew this but felt like section is after div most suitable element for page wrapper. Will change it to div though.

[Paulie_D]

I’m assuming that what you are trying to do is actually center the section with an Id of #articlelist…correct?

To do that just delete this

#articleList {
float: left;
margin: 0;
padding-left: 200px;
}

..and the default styling for section will kick in

section {
width: 80%;
margin: 40px auto;
}

So now your #articlelist is centered you might want to think about doing something else with the logo.

[VladimirKrstic]

I wan’t logo to stay there fixed, article list on left and everything together centered nicely. Though i found solution, changing section into div did the job. Why, who knows. So you helped me actually. :)

Thank you.

[Author]

Posts