SitePoint Sponsor |
|
User Tag List
Results 1 to 2 of 2
-
Jun 14, 2005, 23:28 #1
- Join Date
- Sep 2004
- Location
- new york
- Posts
- 116
- Mentioned
- 0 Post(s)
- Tagged
- 0 Thread(s)
CSS layout coming good but still problems
Hello,
Can you please look at the css code and see if there is stuff that needs to to be remove or put into a another location?
I am trying to have a padding of 10px all around but it is not doing it.
My footer is not being centered.
Also, as you can see the text is not overflowing under the grey box on the left side?
How can I fix all of that?
Here is the url: http://members.cox.net/19kash88/sd/index.html
Here is the css url: http://members.cox.net/19kash88/sd/css/sd.css
Thanks
-
Jun 15, 2005, 00:35 #2
- Join Date
- Apr 2003
- Location
- sowth afreeka
- Posts
- 374
- Mentioned
- 0 Post(s)
- Tagged
- 0 Thread(s)
Hi there.
This is the quick way to fix the footer problem, not sure if its 100% the correct way.
Sorry, I cant go through all the code, perhaps this evening, as I am very busy at the moment, hope this helps in some way?
HTML Code:<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1"> <title>Saint Demiana Coptic Orthodox Church in San Diego, California</title> <link href="css/sd.css" rel="stylesheet" type="text/css"> <style type="text/css"> body { font-family:Verdana, Arial, Helvetica, sans-serif; font-size:12px; margin:0px auto 0px auto; background-image:url(../media/images/bg/bg.jpg); background-repeat:repeat; background-attachment: fixed; } p { margin: .625em 0 1.5em; line-height: 14px; text- } #container { width: 770px; padding: 10px; margin: 0 auto; background-image:url(../media/images/bg/contentbg.gif); background-repeat:repeat-y; } #mainnav { text-align:right; padding-top:1px; padding-right: 10px; padding-bottom:10px; } #navlist li { display: inline; list-style-type: none; padding-right: 10px; padding-top:10px; } ul#navlist a:link, ul#navlist a:visited{ text-decoration:underline; color: #990000; } ul#navlist a:hover, ul#navlist a:active{ text-decoration: none; color: #74150a; } .header { background-image:url(../media/header/header.jpg); background-repeat:no-repeat; background-position:center; height:125px; width: 740px; padding:5px; } #websitenews { background-image:url(../media/header/websitenews.jpg); background-repeat:no-repeat; float:right; height:50px; width:500px; padding-right:20px; margin-top:10px; padding-left:20px; padding-bottom:1px; } #content { width:500px; padding-right:20px; padding-left:20px; line-height:1px; clear: right; float: left; margin: 15px 0 0; overflow: hidden; } #clear { clear:both; } #sidenav { margin-left:10px; margin-top:10px; width:200px; height:500px; background-color:#f1f1f1; float: left; border: 1px dotted black; clear: left; } #footer { font-size: 10px; height: 50px; padding-right:10px; padding-left:10px; margin: 10px auto 10px auto; border-top:1px solid black; vertical-align: bottom; width: 720px; color: #333300; text-align: center; line-height: 25px; background: #e4e4d8; clear: both; } </style> </head> <body> <div id="container"> <div id="mainnav"> <ul id="navlist"> <li><a href="#">articles</a></li> <li><a href="#">church schedule</a></li> <li><a href="#">forums</a></li> <li><a href="#">our priest</a></li> <li><a href="#">presentations</a></li> <li><a href="#">contact us</a></li> </ul> </div> <div class="header">header</div> <div id="clear"></div> <div id="websitenews">website news</div> <div id="sidenav"> side nav </div> <div id="content"> <p>"Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum." "Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum." "Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum." "Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum." "Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum." "Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum." "Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum." "Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum." </p> </div> <div id="footer">footer</div> </div> </body> </html>
Cheers
OxMy postings are a natural product.
The slight variations in spelling and grammar enhance its
individual character and beauty and in no way are to be
considered flaws or defects - http://www.guinnesspig.net
Bookmarks