473,231 Members | 1,913 Online
Bytes | Software Development & Data Engineering Community
Post Job

Home Posts Topics Members FAQ

Join Bytes to post your question to a community of 473,231 software developers and data experts.

Content Div Auto Height

Hello,

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
  1. /*\*/
  2. * html .minwidth, * html .container, * html .content, * html .layout  {
  3.     height:1px;
  4. }
  5. /**/
  6.  
  7. * html .minwidth {
  8.     padding-left:800px; /* CHANGED MARGIN TO PADDING */ 
  9. }
  10.  
  11. * html .container {
  12.     margin-left:-800px;
  13.     position:relative; /* ADDED */    
  14. }
  15.  
  16. .width {
  17.     width:90%;
  18.     min-width:800px; /* CHANGED TO REMOVE BACKGROUND COLOR */
  19.     border:3px solid green;
  20.     margin:10px auto;
  21. }
  22.  
  23. .container
  24. {
  25. border: 3px solid red;
  26. }
  27.  
  28. #top
  29. {
  30. width: auto;
  31. height: auto;
  32. border: 3px solid blue;
  33. }
  34.  
  35. #topnavcontainer
  36. {
  37. height: 98px;
  38. padding: 5px;
  39. border: 3px solid orange;
  40. }
  41.  
  42. ul
  43. {
  44. padding: 0;
  45. margin: 0;
  46. list-style: none;
  47. }
  48.  
  49. li
  50. {
  51. float: left;
  52. position: relative;
  53. padding-right: 5em;
  54. font: 12px arial, verdana, lucida, sans-serif;
  55. }
  56.  
  57. a#nosub:link
  58. {
  59. color: #9EAEBB;
  60. text-decoration: none;
  61. padding-right: 2em;
  62. background: transparent url("images/square_off.jpg") right center no-repeat;
  63. }
  64.  
  65. a#nosub:visited
  66. {
  67. color: #9EAEBB;
  68. }
  69.  
  70. a#nosub:hover
  71. {
  72. color: #49677F;
  73. text-decoration: none;
  74. background: transparent url("images/square_on.jpg") right center no-repeat;
  75. }
  76.  
  77. a#nosub:active
  78. {
  79. color: #9EAEBB;
  80. }
  81.  
  82. li
  83. {
  84. color: #9EAEBB;
  85. }
  86.  
  87. li ul
  88. {
  89. display: none;
  90. position: absolute; 
  91. top: 1em;
  92. left: 0;
  93. }
  94.  
  95. li > ul
  96. {
  97. top: auto;
  98. left: auto;
  99. }
  100.  
  101. li:hover ul, li.over ul
  102. {
  103. display: block;
  104. }
  105. //subnav style
  106. #nav li li{ margin: 0 0 .2em 0; }
  107.  
  108. #nav li li a
  109. {
  110. display: block;
  111. color: #49677F;
  112. background-color: #9EAEBB;
  113. width: 5em;
  114. padding: .2em .8em;
  115. text-decoration: none;
  116. }
  117.  
  118. #nav li li a:hover
  119. {
  120. background-color: #49677F;
  121. color: #FFF;
  122. text-decoration: none;
  123. }
  124.  
  125. #sub li a
  126. {
  127. background-image: none;
  128. }
  129.  
  130.  
  131. #content
  132. {
  133. border: 3px solid black;
  134. margin: 0px;
  135. width: auto;
  136. height: auto;
  137. }
  138.  
  139. #thumbs
  140. {
  141. border: 3px solid red;
  142. width: 202px;
  143. float: right;
  144. }
  145.  
  146. #thumblarge
  147. {
  148. border: 3px solid blue;
  149. margin: 0px;
  150. width: 520px;
  151. padding: 0px;
  152. }
  153.  
  154. #bottom
  155. {
  156. clear: both;
  157. margin: 0;
  158. border: 3px solid blue;
  159. }
  160.  
  161.  
/*end code*/
Nov 15 '07 #1
1 2937
drhowarddrfine
7,435 Expert 4TB
Add overflow:auto; to the wrapping container's CSS. Elements are not to expand to contain floated elements.
Nov 15 '07 #2

Sign in to post your reply or Sign up for a free account.

Similar topics

11
by: Not4u | last post by:
Hello, I have a problem with CSS code. I want to have one menu column with a fixed width and a 100% height and the rest of the page for content. ---------------- |.|.|<--100%-->|...
0
by: Ataru Morooka | last post by:
Hello, I am renewing a website using CSS and I have some problems with IE6. Following this link: http://www.ansv.it/templates/Template_Index_IT.dwt.asp you may notice that the container area has...
19
by: Jerry | last post by:
Hi Folks, Ok, here's my story. I was asked to create a website for the church I attend. I am a complete newbie to creating websites. So, I did the usual -- did a bunch of googling, found...
3
by: autospanker | last post by:
Ladies and Gentleman, I have been having this problem that has been driving me insane. I have a website that when viewed in Firefox first, the content in the body area is pushed down. Then when...
4
by: camphor | last post by:
hi, I have a single column webpage with a rounded corner box which is positioned on the left in which the links sit, the main content is on the right, I am trying to make the page stretch with the...
1
by: lister | last post by:
Hi, I have a div with fluid content, below which I want a scrollable div. I can't work out how to style the scrollable div to say "use the rest of the space in the container". The best I can...
9
by: Lloyd Sheen | last post by:
I have now spent the entire morning on what I think should be easy. I cannot for the life of me figure out how to make a simple one row, two column table where is the contents of the one of the...
6
by: AJM Project | last post by:
Hello, I see this is a well known thing and have seen many answers but none have worked for me. It's just a test page I'm making and I've ran into this so I thought I'd ask how to fix it - inline...
3
by: premprakashbhati | last post by:
hi, good evening.. i am going to upload an image in a web form .....for that iam using HTML input(file) control and one web control button i.e., Upload_Button() here is the code ...its work fine...
0
by: VivesProcSPL | last post by:
Obviously, one of the original purposes of SQL is to make data query processing easy. The language uses many English-like terms and syntax in an effort to make it easy to learn, particularly for...
3
isladogs
by: isladogs | last post by:
The next Access Europe meeting will be on Wednesday 3 Jan 2024 starting at 18:00 UK time (6PM UTC) and finishing at about 19:15 (7.15PM). For other local times, please check World Time Buddy In...
0
by: abbasky | last post by:
### Vandf component communication method one: data sharing ​ Vandf components can achieve data exchange through data sharing, state sharing, events, and other methods. Vandf's data exchange method...
2
isladogs
by: isladogs | last post by:
The next Access Europe meeting will be on Wednesday 7 Feb 2024 starting at 18:00 UK time (6PM UTC) and finishing at about 19:30 (7.30PM). In this month's session, the creator of the excellent VBE...
0
by: fareedcanada | last post by:
Hello I am trying to split number on their count. suppose i have 121314151617 (12cnt) then number should be split like 12,13,14,15,16,17 and if 11314151617 (11cnt) then should be split like...
0
by: stefan129 | last post by:
Hey forum members, I'm exploring options for SSL certificates for multiple domains. Has anyone had experience with multi-domain SSL certificates? Any recommendations on reliable providers or specific...
1
by: davi5007 | last post by:
Hi, Basically, I am trying to automate a field named TraceabilityNo into a web page from an access form. I've got the serial held in the variable strSearchString. How can I get this into the...
0
by: DolphinDB | last post by:
Tired of spending countless mintues downsampling your data? Look no further! In this article, you’ll learn how to efficiently downsample 6.48 billion high-frequency records to 61 million...
0
by: Aftab Ahmad | last post by:
Hello Experts! I have written a code in MS Access for a cmd called "WhatsApp Message" to open WhatsApp using that very code but the problem is that it gives a popup message everytime I clicked on...

By using Bytes.com and it's services, you agree to our Privacy Policy and Terms of Use.

To disable or enable advertisements and analytics tracking please visit the manage ads & tracking page.