Basic CSS Questions |
Basic CSS Questions |
Myskillzownu |
Mar 21 2012, 04:41 PM
Post
#1
|
Group: Members Posts: 3 Joined: 21-March 12 Member No.: 16,760 |
So I'm fairly new to CSS, and I have two questions as of right now.
Here's a picture of what my site looks like right now: 1) How do I get my copyright div to stick to the bottom of the page. 2) How to I correctly align my navigation buttons? (A horizontal strip, all of them touching.) Here's my HTML: CODE <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd" > <html lang="en"> <head> <link rel="stylesheet" type="text/css" href="index.css" /> <link rel="stylesheet" type="text/css" href="global.css" /> <link rel="shortcut icon" href="icon.ico" /> <title>Jim's Hardware</title> </head> <body> <div id="wrap"> <div id="header"> <img id="banner" src="images/banner.png" alt="Jim's Hardware Banner" /> <img id="aboutus" src="images/aboutus1.png" alt="About Us" /> <img id="locateus" src="images/locateus1.png" alt="Locate Us" /> <img id="home" src="images/home2.png" alt="Home (Current Page)" /> <img id="shop" src="images/shop1.png" alt="Shop" /> <img id="contactus" src="images/contactus1.png" alt="Contact Us" /> </div> <!--Close header--> <div id="maindiv" class="repeat"> <div id="push"> </div> <!--Close push--> <div id="copyrightdiv"> <p id="copyright"> Copyright © 2012 Jim's Hardware ® </p> </div> <!--Close copyrightdiv--> </div> <!--Close maindiv --> </div> <!--Close wrap--> </body> </html> Here's my global css file (the index.css file is empty right now): CODE body { padding-top:-125px; background-image:url('images/red.png'); background-repeat:repeat-y; background-position:center; margin:0 0 0 0; height:100%; } #copyrightdiv { position:absolute; bottom:0px; width:1000px; margin-left:auto; margin-right:auto; } #maindiv { width:1000px; margin-left:auto; margin-right:auto; } #push { clear:both; } #copyright { position:relative; bottom:0px; clear:both; text-align:center; } #wrap { min-height:100%; position:relative; } #banner { position:relative; display:block; margin-left:auto; margin-right:auto; } #header { background-color:white; height:125px; width:1000px; margin-left:auto; margin-right:auto; } #aboutus { position:relative; display:block; margin-left:auto; margin-right:auto; } #locateus { position:relative; display:block; margin-left:auto; margin-right:auto; } #home { position:relative; display:block; margin-left:auto; margin-right:auto; } #shop { position:relative; display:block; margin-left:auto; margin-right:auto; } #contactus { position:relative; display:block; margin-left:auto; margin-right:auto; } Thanks Edit: There's no red image file (as seen in the body portion of the css file), it's just there for later use. (I copied it from my other website.) This post has been edited by Myskillzownu: Mar 21 2012, 04:44 PM |
Lo-Fi Version | Time is now: 28th March 2024 - 05:52 PM |