PDA

View Full Version : asking for a bit of help with some CSS




eva01
May 16, 2005, 03:46 PM
is there anyway for me to fix a problem i have with my main site on Safari 2.0 (that is the only safari i have on computer)

http://animetunes.com/

i cannot get it to center the main page. :/



michaelrjohnson
May 16, 2005, 04:14 PM
Sure...

Put all of what you have inside an ID.

#all {
margin-left: auto;
margin-right: auto;
}

That should do it.

eva01
May 16, 2005, 05:33 PM
didn't affect it except give me horrizontal scroll bar.

Safari just hates me and rendering CSS

whocares
May 16, 2005, 05:40 PM
I guess you want to center a fixed width 'column' in the page containing your site's content? Try this :

1. Add the following into your CSS file

#content {
position: relative;
left: 50%;
margin-left: -300px;
width: 600px}

2. Enclose all of your page content (ie all between <body> and </body>) with


<div id="content">
your page content goes here
</div>


This will set all your content in a 600 pixel wide strip that centers in the browser window. To change the strip's width, adjust width as needed and always keep left margin so it satisfies:

left-margin = -0.5 * width

Hope this is what you want and that it works for you :)

There are other ways to achieve the same thing in CSS, but I am not familiar with them (yet) ;)

michaelrjohnson
May 16, 2005, 06:57 PM
It's really best for you not to force a dimension on the user. The default screen to design for the web is still 800x600.

My previous example should work, if you set your width (ex: 600px) but use auto margins. Check out the stylesheet for this (http://students.uwsp.edu/mjohn058/304_2/) site (#all). I believe this is what you're looking for.

whocares
May 17, 2005, 05:40 AM
It's really best for you not to force a dimension on the user. The default screen to design for the web is still 800x600.

My previous example should work, if you set your width (ex: 600px) but use auto margins. Check out the stylesheet for this (http://students.uwsp.edu/mjohn058/304_2/) site (#all). I believe this is what you're looking for.

That is the exact same result as with my method ;)