Forum Moderators: not2easy
I can't seem to figure out why?
Also the photos in #mainphoto show up vertically (instead of horizontally) in Dreamweaver CS, but show up fine in Firefox and IE when I Preview in browser.
CSS Posted below, thanks for help!
body {
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 11px;
color: #000000;
text-decoration: none;
margin:0;
padding:0px;
background: #FFFFFF url(../images/background.jpg) repeat-x;
}
#main {
width:739px;
margin:auto;
}
#main-inner {
/*margin:0 21px 16px 21px;*/
padding:0 17px 27px 27px;
min-height:200px;
background-color: #FFFFFF;
background-image: url(../images/bg-main-bottom_squared.gif);
background-repeat: no-repeat;
background-position: center bottom;
}
#main-inner-left {
width: 680px;
display:block;
float:left;
line-height:18px;
}
#logo {
width:739px;
height:97px;
background-color: #677717;
background-repeat: no-repeat;
background-position: center top;
border-bottom:1px solid #C8C8C8;
}
#mainphoto {
height:170px;
border-bottom:1px solid #C8C8C8;
padding:3px 0 3px 0;
background-color: #FFFFFF;
}
#teamphoto {
height:170px;
background-color: #FFFFFF;
padding:3px 0 3px 0;
}
h1, h2, h3, h4, h5, h6 { margin: 15px 0; }
p, ul, ol { margin: 15px 0; }
div#navbar {
width: 674px;
display:block;
float:right;
height: 40px;
background: url(../images/navback2.jpg) repeat-x;
padding-left: 65px;
}
div#navbar ul {
margin: 0px;
padding: 0px;
line-height: normal;
list-style: none;
}
div#navbar li {
}
div#navbar li a {
text-decoration: none;
padding: 0 10px 0 0;
color: #FFFFFF;
display:block;
float:right;
width:90px;
height:30px;
font-family: Calibri;
font-size: 12px;
text-align:center;
line-height: 34px;
}
div#navbar li a:link {
color: #FFFFFF:
}
div#navbar li a:visited {
color: 677717;
text-decoration: underline;
}
#Nophotos {
background-color: #FFFFFF;
}
div#navbar li a:hover {
color: #FFFFFF;
background: url(../images/navback.jpg);
}
.clear {
clear:both;
}
#footer {
clear:both;
font-size: 10px;
color:#FFFFFF;
text-align:center;
padding:12px;
line-height:18px;
}
#footer a:link, #footer a:visited {
color:#FFFFFF;
text-decoration:none;
}
#footer a:hover {
color:#FFFFFF;
text-decoration:underline;
}
.highlight {
color:#677717;
text-decoration:none;
font-size:11px;
font-weight:bold;
}
.highlight a, .highlight a:visited {
color:#677717;
text-decoration:none;
text-indent:20px;
}
.highlight a:hover {
color:#00CC33;
text-decoration:underline;
text-indent:20px;
}
a, a:visited {
color:#9ca768;
text-decoration:underline;
}
a:hover {
color:#999900;
text-decoration:none;
}
h1 {
font-family: Calibri;
font-size: 20px;
color: #677717;
font-weight:normal;
}
h2 {
font-family: Calibri;
font-size: 16px;
color: #677717;
font-weight:normal;
}
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
<div id="main">
<div id="logo"><a href="index.html"><img src="images/LogoNew.jpg" border="0" style="display:block;float:left;" /></a>
</div>
<div id="navbar">
<ul>
<li><a href="contact.html">CONTACT</a></li>
<li><a href="properties.html">PROPERTIES</a></li>
<li><a href="services.html">SERVICES</a></li>
<li><a href="partners.html">PARTNERS</a></li>
<li><a href="team.html">PEOPLE</a></li>
<li><a href="index.html">COMPANY</a></li>
</ul>
</div>
<div id="mainphoto"><img src="images/center.jpg" alt="" /><img src="images/P_center.jpg" alt="" /><img src="images/B_Center.jpg" alt="" border="0" /></div>
<div class="clear"></div>
[edited by: swa66 at 1:02 am (utc) on July 30, 2009]
[edit reason] examplified [/edit]
