Forums > position/column issues?

Forums > Resource Center > Webmasters' Corner > Webmasters' Corner Resolved Topics

crazy_goat_blackie

Nov 11 2005, 04:21 PM

not only am i new to CSS, i'm extreemmmly new to the whole column/positioning thing. i wanted to have to boxes next to eachother, not one on top of the other, so i picked up and went through a couple of my CSS books and read a little about positioning. i picked out some example codes from there and everything was working, i *thought*...anyways, first it was perfect on internet explorer then it was bad in mozilla and i changed things in the code then it was opposite...s'really screwy. anyways, here's the site i'm talking about

http://crazygoat.diary-x.com <--- i want the bottom part with "backwards/forwards/comments/etc." to be centered, but i don't know how. i tried different positionings and floating but nothing worked.

i've spent the past two hours going through my books but they're all written in a non-rachael language that i can't exactly comprehend

help?

oh yeah...here's my code:

<!-- begin code provided by createblog.com --><br /><!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "DTD/xhtml1-transitional.dtd"><br />	<html xmlns="http://www.w3.org/1999/xhtml"><br /><br /><head><br /><title> Crazy Goat Design : Templates And More</title><br /><script type="text/javascript" src="http://www.haloscan.com/load/cgblackie"> </script><br /><br /><style type="text/css"><br /><br />body<br /> {<br /> background-image: url(http://img15.imgspot.com/u/05/314/12/crazygoatsmall1131730593.PNG);<br /> background-position: bottom right;<br /> background-repeat: no-repeat;<br /> background-color:#ffffff;<br /> scrollbar-track:#999999;<br /> scrollbar-arrow:#E7E2A0;<br /> scrollbar-face:#AAAAAA;<br /> }<br /><br />a:link<br /> {<br /> font-family:trebuchet ms;<br /> font-size:11px;<br /> color:#555555;<br /> text-decoration:none;<br /> }<br /><br />a:visited<br /> {<br /> font-family:trebuchet ms;<br /> font-size:11px;<br /> color:#555555;<br /> text-decoration:none;<br /> }<br /><br />a:hover<br /> {<br /> font-family:trebuchet ms;<br /> font-size:11px;<br /> color:#888888;<br /> text-decoration: underline overline;<br /> }<br /><br />div#sidebar <br />{<br />width:180px;<br />height:290px; <br />float:left;<br />overflow: auto; <br />background:#E7E2A0; <br />margin-right:50px; <br />color:black; <br />border:2px solid #000000;<br />padding:4px;<br />margin-left:10px;<br />scrollbar-track:#999999;<br />scrollbar-face:#000000;<br />scrollbar-arrow:#ffffff;<br />}<br /><br />div#main<br /> {<br />width:490px; <br />height:290px; <br />overflow: auto; <br />background:#E7E2A0; <br />color:black; <br />border:2px solid #000000;<br />padding:4px;<br />scrollbar-track:#999999;<br />scrollbar-face:#000000;<br />scrollbar-arrow:#ffffff;<br />}<br /><br /><br />div#footer<br />{<br />width:400px;<br />top:80%;<br />left:50%;<br />}<br /><br /></style><br /><br /><br /><center><br /><br><br /><img src="http://img15.imgspot.com/u/05/314/12/title1131730682.png" /><br /></br><br /></center><br /><br><br /><br /><div id="sidebar"><br /><center><br /><p><form action="https://www.paypal.com/cgi-bin/webscr" method="post"><br /><input type="hidden" name="cmd" value="_s-xclick"><br /><input type="image" src="https://www.paypal.com/en_US/i/btn/x-click-but21.gif" border="0" name="submit" alt="Make payments with PayPal - it's fast, free and secure!"><br /><input type="hidden" name="encrypted" value="-----BEGIN PKCS7-----MIIHHgYJKoZIhvcNAQcEoIIHDzCCBwsCAQExggEwMIIBLAIBADCBlDCBjjELMAkGA1UEBhMCVVMxCzAJ<br />gNVBAgTAkNBMRYwFAYDVQQHEw1Nb3VudGFpbiBWaWV3MRQwEgYDVQQKEwtQYXlQYWwgSW5jLjETMBEGA<br />UECxQKbGl2ZV9jZXJ0czERMA8GA1UEAxQIbGl2ZV9hcGkxHDAaBgkqhkiG9w0BCQEWDXJlQHBheXBhbC<br />jb20CAQAwDQYJKoZIhvcNAQEBBQAEgYAklFHTjz6lmH9RRqZM4xObTShaAD/gmKW3h3ioOPAskVbV/RS7YJvlWH+xkM5/CaagMctnijyckWdEr3l0yGGgXBXcpYdnkDrD6ryX0WecCdfX2HGAkTXzqB9k5FBOfepQOpc/z3HYEaFE32RH5MHD39cslt7CtC3OU3I/NidcvDELMAkGBSsOAwIaBQAwgZsGCSqGSIb3DQEHATAUBggqhkiG9w0DBwQITGk5R7D7iqWAeJieXJ9S<br />ybWvCPHoTOirjJiOGzLE1jwYLVzSRTDn8scsG+y1gE6EE2Gaz1cywAft6ydcvdiz7DJ2/VOYqAOMMeAojJRar5MNqAIElv2O3385i1BfTnCAyaPREztmcs4fxSGR8ZNchOUpR88uPYBnv8aDMoiol<br />0R6CCA4cwggODMIIC7KADAgECAgEAMA0GCSqGSIb3DQEBBQUAMIGOMQswCQYDVQQGEwJVUzELMAkGA1U<br />CBMCQ0ExFjAUBgNVBAcTDU1vdW50YWluIFZpZXcxFDASBgNVBAoTC1BheVBhbCBJbmMuMRMwEQYDVQQL<br />ApsaXZlX2NlcnRzMREwDwYDVQQDFAhsaXZlX2FwaTEcMBoGCSqGSIb3DQEJARYNcmVAcGF5cGFsLmNvb<br />AeFw0wNDAyMTMxMDEzMTVaFw0zNTAyMTMxMDEzMTVaMIGOMQswCQYDVQQGEwJVUzELMAkGA1UECBMCQ0<br />xFjAUBgNVBAcTDU1vdW50YWluIFZpZXcxFDASBgNVBAoTC1BheVBhbCBJbmMuMRMwEQYDVQQLFApsaXZ<br />X2NlcnRzMREwDwYDVQQDFAhsaXZlX2FwaTEcMBoGCSqGSIb3DQEJARYNcmVAcGF5cGFsLmNvbTCBnzAN<br />gkqhkiG9w0BAQEFAAOBjQAwgYkCgYEAwUdO3fxEzEtcnI7ZKZL412XvZPugoni7i7D7prCe0AtaHTc97<br />Ygm7NsAtJyxNLixmhLV8pyIEaiHXWAh8fPKW+R017+EmXrr9EaquPmsVvTywAAE1PMNOKqo2kl4Gxiz9<br />ZqIajOm1fZGWcGS0f5JQ2kBqNbvbg2/Za+GJ/qwUCAwEAAaOB7jCB6zAdBgNVHQ4EFgQUlp98u8ZvF71ZP1LXChvsENZklGswgbsGA1UdIwSBszCBsIAU<br />p98u8ZvF71ZP1LXChvsENZklGuhgZSkgZEwgY4xCzAJBgNVBAYTAlVTMQswCQYDVQQIEwJDQTEWMBQGA<br />UEBxMNTW91bnRhaW4gVmlldzEUMBIGA1UEChMLUGF5UGFsIEluYy4xEzARBgNVBAsUCmxpdmVfY2VydH<br />xETAPBgNVBAMUCGxpdmVfYXBpMRwwGgYJKoZIhvcNAQkBFg1yZUBwYXlwYWwuY29tggEAMAwGA1UdEwQ<br />MAMBAf8wDQYJKoZIhvcNAQEFBQADgYEAgV86VpqAWuXvX6Oro4qJ1tYVIT5DgWpE692Ag422H7yRIr/9j/iKG4Thia/Oflx4TdL+IFJBAyPK9v6zZNZtBgPBynXb048hsP16l2vi0k5Q2JKiPDsEfBhGI+HnxLXEaUWAcVfCsQF<br />d2A1sxRr67ip5y2wwBelUecP3AjJ+YcxggGaMIIBlgIBATCBlDCBjjELMAkGA1UEBhMCVVMxCzAJBgNV<br />AgTAkNBMRYwFAYDVQQHEw1Nb3VudGFpbiBWaWV3MRQwEgYDVQQKEwtQYXlQYWwgSW5jLjETMBEGA1UEC<br />QKbGl2ZV9jZXJ0czERMA8GA1UEAxQIbGl2ZV9hcGkxHDAaBgkqhkiG9w0BCQEWDXJlQHBheXBhbC5jb2<br />CAQAwCQYFKw4DAhoFAKBdMBgGCSqGSIb3DQEJAzELBgkqhkiG9w0BBwEwHAYJKoZIhvcNAQkFMQ8XDTA<br />MDcwMjAwMjcwN1owIwYJKoZIhvcNAQkEMRYEFEOPPIaJ41qOdp7r+Qqci88HI2iAMA0GCSqGSIb3DQEB<br />QUABIGAFsGgwBoPsRAcsLFl+syIHsU/t42lzJo/yKR/pwFqouOQ29K90zsqeGr79opg+CoGTc6NLL31HgdPPDd48DsHM+r4HU8scU6S9sZ71E9E/uR7oRGTt9SFii+RQcPMMn0iC95LpBQGQwPVPmS3gv4YvydlVJAUgR3SWtUcxqFiawQ=-----END PKCS7-----<br /><br />"><br /></form></p><br /><font face="trebuchet ms" color="#000000" size="+1"><br /><b>Navigate</b><br><br /></font><br /><font face="trebuchet ms" color="#000000" size="-1"><br />: <a href="http://crazygoat.diary-x.com" title="home">Home</a> :<br></br><br />: <a href="http://crazygoat.diary-x.com/journal.cgi?action=archive" title="archive">Archives</a> :<br></br><br />: <a href="http://crazygoat.diary-x.com/journal.cgi?entry=20051101c" title="Rules and Regulations">Rules</a> :<br></br><br />: <a href="http://crazygoat.diary-x.com/journal.cgi?entry=20051101e" title="Free Templates">Templates</a> :<br></br><br />: <a href="http://crazygoat.diary-x.com/journal.cgi?entry=20051101d" title="Frequently Asked Questions">F.A.Q.</a> :<br></br><br />: <a href="mailto:sades.black@gmail.com" title="Email Me">Email</a> :<br></br><br />: <a href="http://crazygoat.diary-x.com/journal.cgi?entry=20051101g" title="Custom Designs">Customs</a> :<br></br><br /></font><br /><font face="trebuchet ms" color="#000000" size="+1"><br /><b>Credit</b><br><br /></font><br /><font face="trebuchet ms" color="#000000" size="-1"><br />: <a href="http://imgspot.com" title="ImgSpot">Host</a> :<br></br><br />: <a href="http://diary-x.com" title="Diary X">Diary X</a> :<br></br><br />: <a href="IMAGE" title="Images">Image</a> :<br></br><br />: <a href="http://sblack.diary-x.com" title="The Designer">Black</a> :<br></br><br /></font><br /><font face="trebuchet ms" color="#000000" size="+1"><br /><b>Other</b><br><br /></font><br /><font face="trebuchet ms" color="#000000" size="-1"><br />: <a href="LINKS" title="Uber Links">Links</a> :<br></br><br />: <a href="ABOUT" title="About the Site">About</a> :<br></br><br />: <a href="DESIGNER" title="The Designer">Designer</a> :<br></br><br />: <a href="http://www.cafepress.com/crazy_goat" title="The Crazy Goat Store">Store</a> :<br></br><br /></font><br /></center><br /></div><br /><br /><div id="main"><br /><center><br /><font face="trebuchet ms" color="#000000" size="+1"><br />[title]<br /></font><br /><br><br /><font face="trebuchet ms" color="#000000" size="+0"><br />[date]<br /></font><br /></center><br /><br><br /><font face="trebuchet ms" color="#000000" size="-1"><br />[body]<br /></font><br /></div><br /><br /><div id="footer"><br /><center><br /><font face="trebuchet ms" color="#000000" size="+0"><br /><br><br />:: <a href="[prev url]">Backwards</a> :: Blackie posted at [time] :: <a href="[next url]">Forwards</a> ::<br /></br><br><br /><font face="trebuchet ms" color="#000000" size="-1"><br />:: <!-- Start FastWebCounter.com  --><br /><a href="http://www.fastwebcounter.com" title="Free Web Counter"><script src="http://fastwebcounter.com/secure.php?s=crazygoat.diary-x.com"></script> visitors</a><br /><br /><!-- End FastWebCounter.com  --> :: <br /><br /><a href="javascript:HaloScan('[datestamp]');" target="_self"><script type="text/javascript">postCount('[datestamp]'); </script></a> ::<br /><br /><!-- Start FastOnlineUsers.com --><br /><a href="http://www.fastonlineusers.com"><script src=http://fastonlineusers.com/online.php?d=crazygoat.diary-x.com></script> online</a><br /><!-- End FastOnlineUsers.com -->::<br><br />© Crazy Goat Design 2005<br /></font><br /></center><br /></div><br /><br /><br /><br /><br /><br /></head><br /></html><br /><br /> <br /><!-- end code provided by createblog.com -->

Heathasm

Nov 12 2005, 03:30 AM

ok well i added the width of your sidebar and main content area and made that number the width of your footer vola!

div#footer
{
width:670px;
}

crazy_goat_blackie

Nov 12 2005, 06:40 PM

oh...*feels stupid now*...thanks... :S

crazy_goat_blackie

Nov 12 2005, 06:42 PM

oh...*feels stupid now*...thanks... :S

This is a "lo-fi" version of our main content. To view the full version with more information, formatting and images, please click here.