Recommended Posts

Ok well erhm.. I want to center my container. I've done it loads of times. But I can't get it right this time. Internet Explorer does center but FireFox doesn't. I prolly have an error in my code but I can't figure it out right now.

/* MAIN PAGE SETUP */
body
{
text-align: center;
background-color: gray;
}
#container
{
[u][b]margin: 0 auto;[/b][/u]
width: 860px;
background-color: #006;
}

/* LOGO */
#logo
{
width: 860px;
height: 200px;
background: url('images/logo.jpg');
}

/* NAVIGATION */
.navbar
{
padding-top: 5px;
padding-bottom: 3px;
width: 100%;
background: url('images/button.jpg');
}
.navbar ul {
padding: 0px;
margin: 0px;
display: inline;
}
.navbar li {
list-style: none;
display: inline;
margin: 0px;
padding: 0px;
}
.navbar li a
{
width: 100px;
padding-top: 5px;
padding-bottom: 3px;
padding-left: 10px;
padding-right: 10px;
color: #FFFFFF;
font-family: arial;
font-size: 20px;
font-weight: bold;
text-decoration: none;
background: url('images/button.jpg');
}
.navbar li a:hover {
background: url('images/button_hover.jpg');
}

/* CONTENT */
#content
{
margin-left: auto;
margin-right: auto;
text-align: left;
min-height:500px;
height:auto !important;
height:500px;
}

That's my CSS

Thanks alot

*kingdutch waves at Jeff, Go besttechie!

SOLVED: placed a margin: 0 auto; in the container (Works for firefox somehow :mellow: )

Edited by kingdutch
Link to post
Share on other sites

Setting the left and right margins to 'auto' is the standard way to centre a block and it should work in all remotely CSS compliant browsers. (everything except IE)

text-align should ONLY apply to inline text within the applicable element (Check the W3C spec if you want). But IE centres block children as well. This is wrong, simply thinking about it should make it obvious why as combining these two different functions makes the whole mechanism far less flexible. Centring just one block in IE requires that you wrap it in an extra element.

Link to post
Share on other sites
  • 15 years later...

Firefox Centering is a feature of Firefox that allows you to set the position of the window. I find it useful when I have several windows open and want to keep them all in the same place but don't want to have to move them manually. Visit this https://masterbundles.com/templates/presentations/powerpoint/criminal-justice/ site for more ideas about firefox centering. If there's too much white space around the text, it can be hard for readers to figure out where they should be focusing their attention.

Link to post
Share on other sites

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.

Guest
Reply to this topic...

×   Pasted as rich text.   Paste as plain text instead

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.

Loading...