SitePoint Sponsor

User Tag List

Results 1 to 6 of 6
  1. #1
    SitePoint Enthusiast JMann2380's Avatar
    Join Date
    Jan 2005
    Posts
    39
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    Need help real quick, my containing div is not expanding...

    I am working on a new design for a company I work for and I can't get the containing div to expand with the content div. It expands in Firefox but not in IE. The content div is a float and I imagine the problem lies there. As you can tell I am new to css. Thanks in advance.

    The test site is here: www.rtfence.com/test/index.html

    This is the html
    Code:
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml">
    <head>
    <title>Your Title Tag Here</title>
    <meta http-equiv="content-type" content="text/html; charset=iso-8859-1" />
    <meta name="keywords" content="Your, keywords, here." />
    <meta name="description" content="Your Description Here." />
    <link rel="stylesheet" type="text/css" href="style.css" />
    </head>
    <body>
    <body>
    
    <div id="page">
    	
     <div id="content">
     	<img src="images/sign.jpg" alt="sign"/>
     	<h1>A company founded on integrity, honesty, and reliability.</h1>
    	<p>Whether shopping for something decorative or fencing to protect your children and pets, you have come to the right place. R&T Fence Company Incorporated is family owned and operated and has been setting the standard for the fence industry for over 20 years. For your convenience, we are licensed, bonded, and insured in over 100 cities on a yearly basis.</p>
    	<p>Whether shopping for something decorative or fencing to protect your children and pets, you have come to the right place. R&T Fence Company Incorporated is family owned and operated and has been setting the standard for the fence industry for over 20 years. For your convenience, we are licensed, bonded, and insured in over 100 cities on a yearly basis.</p>
     </div>
    	
     <div id="header">
     	<img src="images/rt_logo.jpg" alt="header"/>
     </div>
     
     <div id="menu">
     	<ul>
     		<li><a class="menu" href="index.html">HOME</a></li>
     		<li><a class="menu" href="products.html">PRODUCTS</a></li>
     		<li><a class="menu" href="estimate.html">ESTIMATE</a></li>
     		<li><a class="menu" href="ourwork.html">OUR WORK</a></li>
     		<li><a class="menu" href="aboutus.html">ABOUT US</a></li>
     		<li><a class="menu" href="contactus.html">CONTACT US</a></li>
     	</ul>
     </div>
     
     <div id="footer">
      <img src="images/bbblogo.jpg" alt="bbb logo"/>
    	<img src="images/afalogo.jpg" alt="afa logo"/><br />
     	&copy;2008 R&amp;T Fence Co. Inc.
     </div>
     
    </div>
    
    </body>
    </html>
    and the CSS
    Code:
    body {
      background-image:url(images/background.gif);
    }
    
    div#page {
    	border:1px solid black;
    	background:#FFFFFF;
      width:760px;
    	margin:0 auto;
    	text-align:left;
    }
    
    div#content {
      width:525px;
      float:right;
      margin:5px 5px 5px 5px;
      min-height:500px;
      _height:500px
    }
    
    div#header {
    	width:200px;
      margin:5px 0px 0px 5px;
    	height:85px;
    }
    
    div#menu {
    	border:1px solid black;
    	background:#CCCCCC;
      width:190px;
      height:250px;
      margin:10px 0px 10px 5px;
    }
    
    div#footer {
      width:200px;
    	margin:0px 0px 5px 5px;
    	font-family:verdana, sans-serif;
      font-size: 8pt;
    }
    
    p {
     font-family:verdana, sans-serif; 
     font-size:10pt;   
    }
    
    p.indent {
     font-family:verdana, sans-serif; 
     font-size:10pt;   
     text-indent:20px;
    }

  2. #2
    SitePoint Guru
    Join Date
    Nov 2005
    Location
    Norway
    Posts
    715
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Hi,
    add to your div#page
    Code:
    div#page {
    	border:1px solid black;
    	background:#FFFFFF;
            width:760px;
    	margin:0 auto;
    	text-align:left;
    	overflow:hidden;
    }

  3. #3
    Function Curry'er JimmyP's Avatar
    Join Date
    Aug 2007
    Location
    Brighton, UK
    Posts
    2,006
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Add overflow:auto to #page in the css ... Let me know if that works
    James Padolsey
    末末末末末末末末末末末末末末末末末末末
    Awesome JavaScript Zoomer (demo here)
    'Ajaxy' - Ajax integration solution (demo here)

  4. #4
    SitePoint Enthusiast JMann2380's Avatar
    Join Date
    Jan 2005
    Posts
    39
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    both methods worked.. thanks!!

  5. #5
    SitePoint Guru
    Join Date
    Nov 2005
    Location
    Norway
    Posts
    715
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Just remember that overflow:auto will add scrollbar(s) if the content exceeds the container. While overflow:hidden will chop it off .
    Read more in Sitepoint's CSS reference

  6. #6
    Function Curry'er JimmyP's Avatar
    Join Date
    Aug 2007
    Location
    Brighton, UK
    Posts
    2,006
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Quote Originally Posted by fredda View Post
    Just remember that overflow:auto will add scrollbar(s) if the content exceeds the container. While overflow:hidden will chop it off .
    Read more in Sitepoint's CSS reference
    good point
    James Padolsey
    末末末末末末末末末末末末末末末末末末末
    Awesome JavaScript Zoomer (demo here)
    'Ajaxy' - Ajax integration solution (demo here)


Bookmarks

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •