|
|
||||||
|
||||||
| Index Link To US Private Messages Archive FAQ RSS | ||||||
| Graphics & Design Discussion Forum Post your graphics design questions/comments/ideas in here. Ask questions, post tutorials, discuss trends and best practices. Sub-forum for website accessibility and usability. |
Share Thread: & Tags
|
||||
|
![]() |
|
|
LinkBack | Thread Tools | Display Modes |
|
|||
|
Hello Guys,
In CSS I am having trouble centering a fixed multi column layout with the a frame container having a repeating background image. The below code make IE5 center but I cannot center in mozilla. BODY { background-color : yellow; margin: 0 auto; text-align: center; /*makes IE5 play nice*/ } Any Ideas would be appreciated
__________________
No trees were harmed in the making or sending of this message. However a great number of electrons were terribly inconvenienced! |
|
|||
|
Cheers Easywebdev,
Gave it a go but the problem rmains unsolved. Here's the full code (shoulda posted it first) <head> <title>Three-column Layout</title> <style type="text/css"> BODY { background-color : yellow; margin: 0 auto; text-align: center; /*makes IE5 play nice*/ } #content { background-color: yellow; padding: 0px; position: relative; width:760px; height: 600px; margin-right: auto; margin-left: auto; text-align: center; margin: 0px 0px 0px 15px; } #left { background-color: green; padding: 00px; text-align: left; width: 253.00px; position: absolute; left: 0px; top: 150px; } #middle { background-color: yellow; padding: 0px; text-align: left; width: 253.00px; position: absolute; left: 253px; top: 150px; } #right { background-color: silver; padding: 00px; text-align: right; width: 253.00px; position: absolute; right: 0px; top: 150px; } H1 { background-image: url(images/back.gif); background-repeat: repeat-y; margin-top: 0px; height: 600px; } H1 span { display:none; } </style> </head> <body> <div id="content"> <H1><span> </span></H1> [img]images/test_logo.gif[/img] keywords <div id="left"> hello </div> <div id="middle"> wow </div> <div id="right"> hello </div> </div> </body>
__________________
No trees were harmed in the making or sending of this message. However a great number of electrons were terribly inconvenienced! |
|
||||
|
You are overriding your left-right margin assignments.
#content { background-color: yellow; padding: 0px; position: relative; width:760px; height: 600px; margin-right: auto; <- set here margin-left: auto; <- set here text-align: center; margin: 0px 0px 0px 15px; <- overriden and set again here } |
![]() |
|
| Thread Tools | |
| Display Modes | |
|
|
|
WebProWorld |
Advertise |
Contact Us |
About |
Forum Rules |
MVP's |
Archive |
Newsletter Archive |
Top |
WebProNews
WebProWorld is an iEntry, Inc. ® site - © 2009 All Rights Reserved Privacy Policy and Legal iEntry, Inc. 2549 Richmond Rd. Lexington KY, 40509 |