I have never done this before, but I did a lot of reading about coding in CSS and put it together. I bug checked it in W3C and everything came back clean, except a couple elements I’d added to play around with later. It’s only one piece (the main nav) that’s giving me issues. I do have padding on it, but I also have padding on the body section, so I have no idea why one looks ok and the other doesn’t.
atlantatalentum.com is the site, I think you can view source and get the html. Here’s my css, i’m aware the scrollbars don’t work, the rest checked clean. What am I doing wrong?
@charset "utf-8";
/* Page Styling */
* {
margin: 0px;
padding: 0px;
}
html {
scrollbar-face-color: #99b;
scrollbar-arrow-color: #fff;
scrollbar-highlight-color: #fff;
scrollbar-shadow-color: #99c;
scrollbar-3dlight-color: #000;
}
body {
background: #7a3233 url(images/Left-Side-Border.jpg) left top repeat-x;
z-index: 1;
margin: 0px auto;
font-family: Georgia, Calisto MT, Garamond, serif;
float: inherit;
}
div.layoutbox {
width: 760px;
margin: 0px auto;
}
/* Styling */
div#header {
width:645px;
height:213px;
font-size: 10px;
text-align: left;
clear: both;
margin: 0px;
color: #000000;
background-image: url(images/Header.jpg);
background-repeat: no-repeat;
}
div#nav {
position: absolute;
top: 213px;
width: 159px;
height: 462px;
font-size: 10px;
text-align: left;
padding: 0px 40px 40px 5px;
clear: both;
margin: 0px;
color: #000000;
background-image: url(images/Navigation.jpg);
background-repeat: no-repeat;
z-index: auto;
}
div#body {
top: 213px;
width: 451px;
height: 462px;
font: normal 16px Georgia, "Calisto MT", Garamond;
text-align: justify;
text-indent: 20px;
clear: both;
margin: 0px 0px 0px 159px;
color: #000000;
background-image: url(images/body.jpg);
background-repeat: no-repeat;
}
div#footer {
top: 676px;
text-align: left;
clear: both;
margin: 0px 0px 0px 26px;
width: 584px;
background-color: #7A3233;
}
#footer a:visited {
color: #e8d8ca;
}
.Heading
{
padding: 0px 0px 0px 0px;
margin: 0px;
font: bold 20px HANA, "Copperplate Gothic Light", Garamond, sans-serif;
text-transform: uppercase;
color: #000000;
text-align: left;
text-decoration: underline;
}
.body_text
{
padding: 0px 15px 0px 0px;
margin: 0px;
font: 15px Georgia, "Calisto MT", Garamond, serif;
text-transform: none;
color: #000000;
text-align: justify;
text-decoration: none;
}
.mailto a:link, a:visited, a:active, a:hover{
text-transform: none;
}
a:link {
font: bold 12px HANA, "Copperplate Gothic Light", Garamond, sans-serif;
text-transform: uppercase;
text-decoration: none;
color: #000000;
}
a:visited {
font: bold 12px HANA, "Copperplate Gothic Light", Garamond, sans-serif;
text-transform: uppercase;
text-decoration: none;
color: #4b1515;
}
a:hover, a:active {
font: bold 12px Georgia, "Calisto MT", Garamond, serif;
text-transform: uppercase;
text-decoration: underline;
color: #000000;
}