Thanks chrishirst. I truly appreciate the help. Unfortunately, much like the person in the thread you linked to, I don't understand what you are trying to say.
Looking back over it, I notice now that content (what the main cell is wrapped in) has float set to left. At first I thought this is what you were referring to. So I wrapped everything contained in content in a mc_content and set float to none. However, this did not change a thing in either browser.
So I went back over the rest of the float settings, and I noticed that I shouldn't have to set mc_headerlink to float: left. At least, I don't think I do. The banner (big orange picture) is set to float left, and the links should appear to the right of it, flowing around the banner. However, this only happens in IE. In firefox, the header links still appear below the banner, as if there isn't enough room to fit them (which there is).
It seems I have a fundamental misunderstanding of floats, but I've read many different articles on them. There has to be something I'm missing though. Any thoughts?
Current code:
Code:
<div id="content">
<div id="mc_content">
<div id="mc_header">
<div id="mc_banner"></div>
<div class="mc_headerlink"><a id="mc_home" href="index.php">Home</a></div>
<div class="mc_headerlink"><a id="mc_photos" href="photos.php">Photos</a></div>
<div class="mc_headerlink"><a id="mc_files" href="files.php">Files</a></div>
<div class="mc_headerlink"><a id="mc_people" href="people.php">People</a></div>
</div>
<div id="mc_body">
<div class="mc_peoplename">Dr. Brown</div>
<div class="mc_peopletitle">Faculty Advisor</div>
<div class="mc_peopleemail">brown@math.vt.edu</div>
<img class="mc_peopleportrait" src="http://www.webmaster-talk.com/images/DrBrown.jpg">
<div class="mc_peoplebio">(bio removed)</div>
</div> <!--MC_BODY-->
<div id="mc_footer">
<a id="mc_empo" href="http://www.emporium.vt.edu/"><img src="../images/link_me.jpg"></a>
<a id="mc_vt" href="http://www.vt.edu"><img src="../images/link_vt.jpg"></a>
<div id="mc_designers">Site designed by: </div>
<span class="mc_designers">Ricky Shadach</span>
</div> <!--MC_FOOTER--> </div> <!--MC_CONTENT-->
</div> <!--CONTENT-->
Code:
#mc_content {
float: none;
width: 100%;
}
#mc_header {
width: 100%;
margin-bottom: 30px;
}
#mc_footer {
text-align: center;
}
#mc_banner {
background: url('../images/logo.jpg') no-repeat;
border: 1px solid black;
width: 400px;
height: 189px;
margin: 0px 10px 5px 0px;
float: left;
}
#mc_body {
width: 100%;
float: none;
}
.mc_headerlink {
/*float: left;*/
margin: 11px 10px;
padding: 2px 2px;
font-size: 14px;
color: #233f5f;
width: 100px;
/*font-weight: 600;*/
border: 1px solid gray;
text-align: center;
}
.mc_headerlink:hover {
background: #dfeeff;
cursor: pointer;
color: #039;
text-decoration: none;
}
#mc_header a:hover {
text-decoration: none;
}
#mc_footer img {
border: 1px solid black;
padding: 0px;
margin: 10px 10px 10px 10px;
}
.mc_eventtitle {
font-size: large;
}
.mc_peoplename {
padding: 0px;
margin: 0px;
}
.mc_peopletitle {
padding: 0px;
margin: 0px;
}
.mc_peopleportrait {
float: left;
}
.mc_peoplebio {
float: left;
margin: 10px;
}
Last edited by rshadarack; 01-21-2008 at 05:34 PM..
|
