Web Design Forum  
 
Go Back   Web Design Forum > Web Software > Programming

Reply
 
LinkBack Thread Tools Display Modes
Old 09-01-2009, 08:04 AM   #1
New Member
 
Join Date: Sep 2009
Posts: 1
Default CSS & IE Problem

URL:
http://squidg.x10hosting.com/kinder2/aboutus.html
http://squidg.x10hosting.com/kinder2/session_times.html

The problem i have with both of thesepages is that the content does not go inside the wrap even though i created them like every other page.

HTML for Aboutus:

<div id="wrap">

<div id="header">

<div id="headerleft">
<img src="logo.jpg" width="191" height="130" alt="Logo">
</div>

<div id="headerright">
<img src="heading.jpg" width="935" height="130" alt="Doncaster Park Kindergarten">
</div>
</div> <!-- end header-->



<div id="contentwrap">
<div id="menu">
<table width="0" border="0" cellspacing="0" cellpadding="0">
<tr>
<td width="65"><p><img src="pink_pencil.gif" width="55" height="43" alt="Image" ></p></td>
<td width="125"><p><a class="menu-pink" href="index.html">Home</a></p></td>
</tr>
<tr>
<td><p><img src="orange_pencil.gif" width="55" height="43" alt="Image" ></p></td>
<td><p><a class="menu-orange" href="aboutus.html">About us</a></p></td>
</tr>
<tr>
<td><p><img src="yellow_pencil.gif" width="55" height="43" alt="Image" ></p></td>
<td><p><a class="menu-yellow" href="session_times.html">Session Times</a></p></td>
</tr>
<tr>
<td><p><img src="green_pencil.gif" width="55" height="43" alt="Image" ></p></td>
<td><p><a class="menu-green" href="enrolment.html">Enrolment</a></p></td>
</tr>
<tr>
<td><p><img src="blue_pencil.gif" width="55" height="43" alt="Image" ></p></td>
<td><p><a class="menu-blue" href="fees.html"> Fees</a></p></td>
</tr>
<tr>
<td><p><img src="purple_pencil.gif" width="55" height="43" alt="Image" ></p></td>
<td><p><a class="menu-purple" href="news.html">News</a></p></td>
</tr>
<tr>
<td><p><img src="red_pencil.gif" width="55" height="43" alt="Image" ></p></td>
<td><p><a class="menu-red" href="upcoming_events.html">Upcoming Events</a></p></td>
</tr>
<tr>
<td><p><img src="teal_pencil.gif" width="55" height="43" alt="Image" ></p></td>
<td><p><a class="menu-teal" href="contact.html">Contact</a></p></td>
</tr>
</table>

</div>

<div id="maincontent">
<span class="heading">About us</span>
<p>Situated in a quiet, leafy area of Doncaster, the Kindergarten provides a safe, secure and stable kindergarten experience. </p>
<p>Doncaster Park Kindergarten is a place where your child will develop and grow physically, socially, emotionally and intellectually.</p>
<img src="http://forums.x10hosting.com/images/IMG_7209.JPG" width="280" height="204" alt="Image">
<img src="http://forums.x10hosting.com/images/IMG_7946.JPG" width="280" height="204" alt="Image">
<p>The Kindergarten is an incorporated association, owned and operated by the parents.</p>
<p>The staff are employed by the association to offer the pre-school program. Parents have an important role in the operation of the kindergarten at all levels. The committee of management is responsible for all administration and financial affairs of the kindergarten and determines the vision and policy of the kindergarten.</p>
<img src="http://forums.x10hosting.com/images/IMG_8236.JPG" width="316" height="230" alt="Image">

</div> <!--end maincontent-->
</div> <!--end content-->


</div>
</body>

CSS:
html, body {
margin:0;
padding:0;
height:100%;
}


#wrap {
width:100%;
margin:auto;
height: 100%;
}


#contentwrap {
width:auto;
background-color:#A8D3FF;
height: 100%;
}


#headerleft {
width:191px;
float:left;

}

#headerright {
width: auto;
}

#menu {
height:100%;
float:left;
width:190px;
background: #62B0FF;
border: solid thin #000;
vertical-align:bottom;
}


#maincontent {
margin-left: 26%;
margin-right: 8%;
padding: 1%;
text-align: left;
}


Also the only page that is displayed properly in IE is the contact page... Why is that?
squidg is offline   Reply With Quote


Old 09-07-2009, 09:39 AM   #2
Super Noob
 
zkiller's Avatar
 
Join Date: Aug 2004
Location: position:relative
Posts: 1,640
Send a message via AIM to zkiller Send a message via Yahoo to zkiller
Default

I haven't looked at it in IE, but first thing I noticed is that you are missing float properties for #headerright and #maincontent. Also, you might want to set some min-width properties for your content containers, #wrap and #contentwrap.

Also here is a good tutorial on the proper use of the float property.

http://css.maxdesign.com.au/floatutorial/

Good luck!
__________________
Stefan, the Post Master

Track Devil - May the boost be with you!
zkiller is offline   Reply With Quote
Reply

Thread Tools
Display Modes

Posting Rules
You may not post new threads
You may not post replies
You may not post attachments
You may not edit your posts

BB code is On
Smilies are On
[IMG] code is On
HTML code is Off
Trackbacks are On
Pingbacks are On
Refbacks are On



All times are GMT. The time now is 01:12 PM.


Camera Forum - Computer Forum - Web Design Forum

Powered by vBulletin® Version 3.8.7
Copyright ©2000 - 2012, vBulletin Solutions, Inc.
Content Relevant URLs by vBSEO 3.6.0 ©2011, Crawlability, Inc.