I've found a few postings of this problem but none of the answers seem to fix my problem. I have a content div wrapped around a left floated image and a right floated table. I want the table to dictate the height to the content div instead of popping out of the bottom of the content div. Seems pretty simple but too complicated for me I guess. If you know how to achieve this please share.
Thanks,
J
/*begin code*/
Expand|Select|Wrap|Line Numbers
- /*\*/
- * html .minwidth, * html .container, * html .content, * html .layout {
- height:1px;
- }
- /**/
- * html .minwidth {
- padding-left:800px; /* CHANGED MARGIN TO PADDING */
- }
- * html .container {
- margin-left:-800px;
- position:relative; /* ADDED */
- }
- .width {
- width:90%;
- min-width:800px; /* CHANGED TO REMOVE BACKGROUND COLOR */
- border:3px solid green;
- margin:10px auto;
- }
- .container
- {
- border: 3px solid red;
- }
- #top
- {
- width: auto;
- height: auto;
- border: 3px solid blue;
- }
- #topnavcontainer
- {
- height: 98px;
- padding: 5px;
- border: 3px solid orange;
- }
- ul
- {
- padding: 0;
- margin: 0;
- list-style: none;
- }
- li
- {
- float: left;
- position: relative;
- padding-right: 5em;
- font: 12px arial, verdana, lucida, sans-serif;
- }
- a#nosub:link
- {
- color: #9EAEBB;
- text-decoration: none;
- padding-right: 2em;
- background: transparent url("images/square_off.jpg") right center no-repeat;
- }
- a#nosub:visited
- {
- color: #9EAEBB;
- }
- a#nosub:hover
- {
- color: #49677F;
- text-decoration: none;
- background: transparent url("images/square_on.jpg") right center no-repeat;
- }
- a#nosub:active
- {
- color: #9EAEBB;
- }
- li
- {
- color: #9EAEBB;
- }
- li ul
- {
- display: none;
- position: absolute;
- top: 1em;
- left: 0;
- }
- li > ul
- {
- top: auto;
- left: auto;
- }
- li:hover ul, li.over ul
- {
- display: block;
- }
- //subnav style
- #nav li li{ margin: 0 0 .2em 0; }
- #nav li li a
- {
- display: block;
- color: #49677F;
- background-color: #9EAEBB;
- width: 5em;
- padding: .2em .8em;
- text-decoration: none;
- }
- #nav li li a:hover
- {
- background-color: #49677F;
- color: #FFF;
- text-decoration: none;
- }
- #sub li a
- {
- background-image: none;
- }
- #content
- {
- border: 3px solid black;
- margin: 0px;
- width: auto;
- height: auto;
- }
- #thumbs
- {
- border: 3px solid red;
- width: 202px;
- float: right;
- }
- #thumblarge
- {
- border: 3px solid blue;
- margin: 0px;
- width: 520px;
- padding: 0px;
- }
- #bottom
- {
- clear: both;
- margin: 0;
- border: 3px solid blue;
- }