0

I am creating a website with three coloums. I have set the height to AUTO in CSS. but when i reach a spefic height it goes over it and it wont expand the div tag. I have tried setting the css to 100% and this wont even help. Please could yu help?

body {
	margin-left: 0px;
	margin-top: 0px;
	background-image: url(images/bg.gif);
	background-repeat: repeat;
}
.hdr2 {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 18px;
	font-weight: bold;
	color: #666666;
	text-decoration: underline;
}
.hdr3 {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 14px;
	font-weight: bold;
	color: #666666;
	text-decoration: underline;
	height: 25px;
}
.hdr4 {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 12px;
	font-weight: bold;
	color: #666666;
	text-decoration: underline;
	height: 20px;
}
.hdr1 {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 24px;
	font-weight: bold;
	color: #666666;
	text-decoration: underline;
}

#container {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 12px;
	font-style: normal;
	color: #000000;
	height: auto;
	width: 850px;
	margin-right: auto;
	margin-left: auto;
	background-color: #000000;
	border-right-width: 1px;
	border-bottom-width: 1px;
	border-left-width: 1px;
	border-right-style: solid;
	border-bottom-style: solid;
	border-left-style: solid;
	border-right-color: #000000;
	border-bottom-color: #000000;
	border-left-color: #000000;
}


#flash-container-header {
	background-color: #000000;
	height: 8px;
	width: 850px;
}

#top-header-container {
	background-color: #000000;
	height: 140px;
	width: 850px;
	margin-right: auto;
	margin-left: auto;
}
#logo {
	height: 140px;
	width: 850px;
}
#menu-container {
	height: 30px;
	width: 850px;
	background-color: #000000;
	margin-top: 10px;
}

#button-container {
	height: 30px;
	width: 850px;
	margin-right: auto;
	margin-left: auto;
}
#home-flash-banner-container {
	height: 200px;
	width: 850px;
}
#main-flash-container {
	float: left;
	height: 200px;
	width: 650px;
}
#forex-container {
	float: left;
	height: 200px;
	width: 200px;
}
#forex-box {
	height: 180px;
	width: 180px;
	margin-top: 5px;
	margin-right: auto;
	margin-left: auto;
}
#index-body-container {
	background-color: #FFFFFF;
	height: 100%;
	width: 850px;
}
#index-box {
	min-height:200px;
	width: 830px;
	margin-top: 10px;
	margin-right: auto;
	margin-bottom: 10px;
	margin-left: auto;
	height: auto;
}

#index-box-left {
	margin: 10px;
	float: left;
	height: auto;
	width: 580px;
	min-height:200px;
}
#index-box-right {
	margin: 10px;
	float: left;
	height: auto;
	width: 210px;
	min-height:200px;
}
#footer-container {
	height: 240px;
	width: 850px;
	margin-top: 10px;
}
#footer-box {
	height: 150px;
	width: 820px;
	margin-top: 15px;
	margin-right: auto;
	margin-left: auto;
	background-color: #FFFFFF;
}

/*  footer menu  */
.box {
	display: inline;
	float: left;
	height: 120px;
	width: 160px;
	margin-top: 10px;
	margin-right: 10px;
	margin-bottom: 10px;
	margin-left: 11px;
	padding-top: 5px;
	padding-right: 10px;
	padding-bottom: 5px;
	padding-left: 10px;
}
span.grey {
	color: #999999;
	font-weight:normal;
	font-size: 9px;
	font-family: Verdana, Arial, Helvetica, sans-serif;
}
.footer-text {
	height: 12px;
	width: 160px;
	padding-top: 3px;
	padding-bottom: 3px;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 10px;
	color: #999999;
}
#footer-notes {
	height: 70px;
	width: 820px;
	margin-right: auto;
	margin-left: auto;
	background-color: #FFFFFF;
	text-align: center;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 9px;
	color: #999999;
}

#structure-container {
	height: auto;
	width: 830px;
	background-color: #FFCC99;
}
#left-structure {
	float: left;
	height: auto;
	width: 180px;
}
#main-structure {
	display: inline;
	float: left;
	height: auto;
	width: 470px;
}
#right-structure {
	display: inline;
	float: left;
	height: auto;
	width: 170px;
}
#games-menu-container {
	height: auto;
	width: 160px;
	padding-right: 10px;
	padding-left: 10px;
	padding-top: 15px;
}
#games-left-banners {
	height: 400px;
	width: 160px;
	margin-top: 25px;
	padding-right: 10px;
	padding-bottom: 30px;
	padding-left: 10px;
}

#main-stucture-box {
	height: auto;
	width: 450px;
	padding-top: 15px;
	padding-right: 10px;
	padding-bottom: 15px;
	padding-left: 10px;
}
.GamesTitle {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 30px;
}
.gamesSubTitle {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 16px;
}
Attachments
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Casino Gaming World</title>
<link rel="shortcut icon" type="image/x-icon" href="images/favicon.ico">
<link href="style.css" rel="stylesheet" type="text/css" />
<link href="gamesCSS.css" rel="stylesheet" type="text/css" />
<link rel="stylesheet" type="text/css" href="jqueryslidemenu.css" />
<script src="Scripts/gamesMenu.js" type="text/javascript"></script>
<script src="Scripts/AC_RunActiveContent.js" type="text/javascript"></script>
<!--[if lte IE 7]>
<style type="text/css">
html .jqueryslidemenu{height: 1%;} /*Holly Hack for IE7 and below*/
</style>
<![endif]-->

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.2.6/jquery.min.js"></script>
<script type="text/javascript" src="jqueryslidemenu.js"></script>

</head>
<body>
<div id="container">
  <div id="top-header-container">
    <div id="logo"><img src="images/logo.jpg" width="850" height="140" /></div>
  </div>

<!-- flash container -->  

  <div id="flash-container-header">
	<object width="850px" height="8px">
    <param name="flash-movie" value="line.swf" />
    <embed src="flash/line.swf" width="850px" height="8px">
    </embed>
  	</object>
  </div>

<!-- menu container  -->
  <div id="menu-container">
    <div id="button-container">
       <div id="myslidemenu" class="jqueryslidemenu">
	   <ul>
				<li><a href="http://www.istl.com">Home</a></li>
				<li><a href="http://">News</a></li>
				<li><a href="http://">Casino's</a>
  			<ul>
  				<li><a href="http://">North America</a></li>
                <li><a href="http://">South America</a></li>
                <li><a href="http://">Central America</a></li>
  				<li><a href="http://">United Kingdom</a></li>
 				<li><a href="http://">Africa</a></li>
  				<li><a href="http://">Australia</a></li>
                <li><a href="http://">Europe</a></li>
                <li><a href="http://">Asia</a></li>
  			</ul>
				</li>
				<li><a href="http://">Employment</a>
            <ul>
  				<li><a href="http://">Management</a></li>
                <li><a href="http://">Pit Boss</a></li>
                <li><a href="http://">Inspector</a></li>
  				<li><a href="http://">Dealer</a></li>
                <li><a href="http://">Slots Manager</a></li>
                <li><a href="http://">Slots</a></li>
 				<li><a href="http://">Survaillance</a></li>
  				<li><a href="http://">Food &amp; Beverage</a></li>
                <li><a href="http://">Cruise Ships</a></li>
  			</ul>
                </li>
                <li><a href="http://">Games</a>
            <ul>
  				<li><a href="http://">Blackjack</a></li>
                <li><a href="http://">Roulette</a></li>
                <li><a href="http://">Poker</a>
                	<ul>
  						<li><a href="http://">Stud Poker</a></li>
                		<li><a href="http://">Let It Ride</a></li>
                		<li><a href="http://">Texas Hold E'm</a></li>
				  </ul>
              </li>
  				<li><a href="http://">Punto Banco</a></li>
                <li><a href="http://">Baccarat</a></li>
              <li><a href="http://">Craps</a></li>
  			</ul>
    </li>
				<li><a href="http://">Find a Friend</a></li>
                <li><a href="http://">Useful Links</a>
                	<ul>
  						<li><a href="http://">Products &amp; Suppliers</a></li>
               		    <li><a href="http://">Gaming Commissions</a></li>
                        <li><a href="http://">Problem Gambling</a></li>
                        <li><a href="http://">Publications</a></li>
                        <li><a href="http://">Problem Gambling</a></li>
                        <li><a href="http://">Problem Gambling</a></li>
				    </ul>
    </li>
   			    <li><a href="http://">Events</a></li>
                <li><a href="http://">Contact Us</a></li>
   		</ul>
		<br style="clear: left" />
	  </div>
	</div>
  </div> 
<!-- End of Header and Menu -->

<div id="index-body-container">
  <div id="index-box">
<!--  Start the include file here --> 
   <div id="structure-container">
     <div id="left-structure">
       <div id="games-menu-container">
       <div class="sidebarmenu">
        <ul id="sidebarmenu1">
        <li><a href="#">Blackjack</a></li>
        <li><a href="#">Roulette</a></li>
        <li><a href="#">Poker</a>
          <ul>
          <li><a href="#">Three Card</a></li>
          <li><a href="#">Texas H' em</a></li>
          <li><a href="#">Stud Poker</a></li>
          </ul>
        </li>
        <li><a href="#">Craps</a></li>
        
        <li><a href="#">Punto Banco</a>
          <ul>
          <li><a href="#">Sub Item 2.1</a></li>
          <li><a href="#">Folder 2.1</a>
            <ul>
            <li><a href="#">Sub Item 2.1.1</a></li>
            <li><a href="#">Sub Item 2.1.2</a></li>
            <li><a href="#">Sub Item 2.1.3</a></li>
            <li><a href="#">Sub Item 2.1.4</a></li>
            </ul>
          </li>
        </ul>
        </li>
        	<li><a href="#">Item 4</a></li>
        </ul>
	 </div>
       </div>
       
       <div id="games-left-banners">Banner Ads</div>
     </div>
     
     <div id="main-structure">
		<div id="main-stucture-box">
		  <div class="GamesTitle">Blackjack</div><hr />
          <p>Blackjack is the easiest of all the casino games to learn, but difficult to master.  It could take some time before you are confident in what you are doing, but not to worry everyone has to start somewhere.  Here I will teach you the basics of blackjack and then what is called strategy to give you a better advantage.</p>
          
          <div class="gamesSubTitle">Layout</div><hr />
          <p>
          but not to worry everyone has to start somewhere.  Here I will teach you the basics of blackjack and then what is called strategy to give you a better advantagebut not to worry everyone has to start somewhere.  Here I will teach you the basics of blackjack and then what is called strategy to give you a better advantage 

          </p>
        </div>
     </div>
     <div id="right-structure">
     <p>&nbsp;</p>
     <p>&nbsp;</p>
     <p>&nbsp;</p>
     <p>&nbsp;</p>
     </div>
   </div>
<!-- Footer include starts here -->
  </div>
</div>
<!-- end of index-body -->
<div id="footer-container">
  
    <div id="footer-box">
      <!-- menu -->
      <div class="box">
      <div class="hdr4">Menu</div>
      <div class="footer-text"><a href="" style="text-decoration:none"><span class="grey">Home</span></a></div>
      <div class="footer-text"><a href="" style="text-decoration:none"><span class="grey">Casino's</span></a></div>
      <div class="footer-text"><a href="" style="text-decoration:none"><span class="grey">Events</span></a></div>
      <div class="footer-text"><a href="" style="text-decoration:none"><span class="grey">Contact Us</span></a></div>
      </div>
      <!-- employment -->
      <div class="box">
      <div class="hdr4">Employment</div>
      <div class="footer-text"><a href="" style="text-decoration:none"><span class="grey">Dealers / Inspectors</span></a></div>
      <div class="footer-text"><a href="" style="text-decoration:none"><span class="grey">Pit Boss</span></a></div>
      <div class="footer-text"><a href="" style="text-decoration:none"><span class="grey">Managers</span></a></div>
      <div class="footer-text"><a href="" style="text-decoration:none"><span class="grey">Slots</span></a></div>
      <div class="footer-text"><a href="" style="text-decoration:none"><span class="grey">Cruise Ships</span></a></div>
      </div>
      <!-- games -->
      <div class="box">
      <div class="hdr4">Games</div>
      <div class="footer-text"><a href="" style="text-decoration:none"><span class="grey">Blackjack</span></a></div>
      <div class="footer-text"><a href="" style="text-decoration:none"><span class="grey">Roulette</span></a></div>
      <div class="footer-text"><a href="" style="text-decoration:none"><span class="grey">Poker</span></a></div>
      <div class="footer-text"><a href="" style="text-decoration:none"><span class="grey">Craps</span></a></div>
      <div class="footer-text"><a href="" style="text-decoration:none"><span class="grey">Punto Banco</span></a></div>
      </div>
      <!-- resources -->
      <div class="box">
      <div class="hdr4">Resources</div>
      <div class="footer-text"><a href="" style="text-decoration:none"><span class="grey">Casino equipment</span></a></div>
      <div class="footer-text"><a href="" style="text-decoration:none"><span class="grey">Gambling Commissions</span></a></div>
      <div class="footer-text"><a href="" style="text-decoration:none"><span class="grey">Publishers</span></a></div>
      <div class="footer-text"><a href="" style="text-decoration:none"><span class="grey">Privacy Policy</span></a></div>
      <div class="footer-text"><a href="" style="text-decoration:none"><span class="grey">Terms &amp; Conditions</span></a></div>
      </div>
    </div>
 	<div id="footer-notes">
    Copyright &copy;
	<script type="text/javascript"> 
var d = new Date()
document.write(d.getFullYear())
</script>
<div>Casino Gaming World cannot be held responsible for the content of external websites</div>
<div>Casino Gaming World is an independent directory and information service not affiliated with any casino. Warning: You must ensure you meet all age and other regulatory requirements before entering a Casino or placing a wager. YOU are responsible for determining if it is legal for YOU to play any particular games or place any particular wager. </div>
</div>
</div>
<!-- end of footer -->
</div>
<!-- google analytics -->
<script type="text/javascript">
var gaJsHost = (("https:" == document.location.protocol) ? "https://ssl." : "http://www.");
document.write(unescape("%3Cscript src='" + gaJsHost + "google-analytics.com/ga.js' type='t
4
Contributors
3
Replies
4
Views
8 Years
Discussion Span
Last Post by almostbob
0

Need your HTML code as well, but I can suggest that you add a position:relative; to your #container. By the way, you've got way too many ambiguous pronouns in your explanation.
"it goes over it and it wont expand the div tag".
Not sure who is "it". ?:|

0

without looking at the css,
zero should have no dimension $0 = 0px = 0 apples = 0em = 0% = 0
zero, as 0(dimension), throws everything into quirks mode, quirks mode causes unreasonable failures
examine your css to find any 0px 0em 0% 0pt and change them to just 0
what is the "specific height" at which failure occurs

**edit
had a look, there are a few, may not be the cause, but removing unpredicatables helps

Edited by almostbob: n/a

This topic has been dead for over six months. Start a new discussion instead.
Have something to contribute to this discussion? Please be thoughtful, detailed and courteous, and be sure to adhere to our posting rules.