SitePoint Sponsor |
|
User Tag List
Results 1 to 4 of 4
Thread: centering problem
-
Oct 25, 2004, 12:15 #1
- Join Date
- Dec 2002
- Location
- Aylmer, QC, Canada
- Posts
- 409
- Mentioned
- 0 Post(s)
- Tagged
- 0 Thread(s)
centering problem
i tried to follow Paul's FAQ : How to centre horizontally and vertically?
i got it working in firefox and opera, but not in IE.
http://www.karinnelegault.com/new3/en/
any help would be greatly appreciated.
-
Oct 25, 2004, 13:20 #2
- Join Date
- Jan 2003
- Location
- Hampshire UK
- Posts
- 40,556
- Mentioned
- 183 Post(s)
- Tagged
- 6 Thread(s)
Hi,
is this what you want or have I got the wrong end of the stick
Code:<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html> <head> <title>Web Design Studio of Karinne Legault</title> <meta name="Description" content="Web design by -- Karinne Legault" /> <meta name="keywords" content="web design, web site, web creation, karinne legault, karinne, outaouais, canada" /> <meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1" /> <meta http-equiv="Content-Style-Type" content="text/css" /> <style> /* karinnelegault.com master styles kl@karinnelegault.com Updated: Oct 25, 2004 */ /* commented backslash hack v2 \*/ html, body{height:100%;} /* end hack */ body { margin: 0; padding: 0; font-family: "Trebuchet MS", Verdana, Arial, sans-serif; font-size: 12px; color: #000; text-align: center; background:#fff url(http://www.karinnelegault.com/new3/images/layout/bg.jpg) repeat-x 50% 35%; min-width:650px; min-height:500px; } #horizon{ position:absolute; top:50%; left:0; width:100%; } #centerall { margin-top:-250px; position: relative; margin-left: auto; margin-right:auto; background-color: #f6f8f9; width: 650px; height: 500px; border: 1px solid #dae2e9; } </style> </head> <body> <div id="horizon"> <div id="centerall">centre</div> </div> </body> </html>
-
Oct 25, 2004, 13:26 #3
- Join Date
- Jan 2003
- Location
- Hampshire UK
- Posts
- 40,556
- Mentioned
- 183 Post(s)
- Tagged
- 6 Thread(s)
I forgot to mention that your layout can be fixed by adding this
Code:#centervert { left:0; height: 200px; }
Hope that helps.
Paul
-
Oct 25, 2004, 17:01 #4
- Join Date
- Dec 2002
- Location
- Aylmer, QC, Canada
- Posts
- 409
- Mentioned
- 0 Post(s)
- Tagged
- 0 Thread(s)
Great! I actually just change the top: 50% to top: 40% in the #horizon.
Thanks a bunch Paul.
Bookmarks