468,238 Members | 2,005 Online
Bytes | Developer Community
New Post

Home Posts Topics Members FAQ

Post your question to a community of 468,238 developers. It's quick & easy.

CSS div problem - C for Catastrophe

10
My HTML:
[HTML]<div style="position:relative;"><div id="mainbody">
<div class="containers">
<div class="tl"></div>
<div class="tm">Articles</div>
<div class="tr"></div>
</div>
<div class="containers">
<div class="ml"></div>
<div class="mm">1<br />1<br />1<br />1<br />1<br />1<br />1<br />1<br />1<br />1<br />1<br />1<br />1<br />1<br />1<br />1<br />1<br /></div>
<div class="mr"></div>
</div>
<div class="containers">
<div class="bl"></div>
<div class="bm"></div>
<div class="br"></div>
</div>
</div></div>[/HTML]
My CSS:
Expand|Select|Wrap|Line Numbers
  1. #mainbody {
  2.     position:relative;
  3.     width:620px;
  4.     margin-left:20px;
  5.     margin-top:10px;
  6.     float:left;
  7. }
  8. #mainbody .containers {
  9.     position:relative;
  10. }
  11. #mainbody .containers .tl {
  12.     background:url(images/body_top_left.png) no-repeat;
  13.     margin:0;
  14.     padding:0;
  15.     width:24px;
  16.     height:24px;
  17.     float:left;
  18. }
  19. #mainbody .containers .tm {
  20.     background:url(images/body_top_midd.png) repeat-x;
  21.     margin:0;
  22.     padding:0;
  23.     width:572px;
  24.     height:21px;
  25.     float:left;
  26.     padding-top:3px;
  27.     font-family:Verdana, Arial, Helvetica, sans-serif;
  28.     color:#ffffff;
  29. }
  30. #mainbody .containers .tr {
  31.     background:url(images/body_top_righ.png) no-repeat;
  32.     margin:0;
  33.     padding:0;
  34.     width:24px;
  35.     height:24px;
  36.     float:left;
  37. }
  38. #mainbody .containers .ml {
  39.     background:url(images/body_mid_all.png) repeat-x #1c811c;
  40.     margin:0;
  41.     padding:0;
  42.     width:24px;
  43.     min-height:250px;
  44.     float:left;
  45. }
  46. #mainbody .containers .mm {
  47.     background:url(images/body_mid_all.png) repeat-x #1c811c;
  48.     margin:0;
  49.     padding:0;
  50.     width:571px;
  51.     min-height:250px;
  52.     float:left;
  53.     font-family:Verdana, Arial, Helvetica, sans-serif;
  54.     color:#ffffff;
  55. }
  56. #mainbody .containers .mr {
  57.     background:url(images/body_mid_all.png) repeat-x #1c811c;
  58.     margin:0;
  59.     padding:0;
  60.     width:24px;
  61.     min-height:250px;
  62.     float:left;
  63. }
  64. #mainbody .containers .bl {
  65.     background:url(images/body_bot_left.png) no-repeat;
  66.     margin:0;
  67.     padding:0;
  68.     width:23px;
  69.     height:23px;
  70.     float:left;
  71. }
  72. #mainbody .containers .bm {
  73.     background:url(images/body_bot_midd.png) repeat-x;
  74.     margin:0;
  75.     padding:0;
  76.     width:573px;
  77.     height:23px;
  78.     float:left;
  79. }
  80. #mainbody .containers .br {
  81.     background:url(images/body_bot_righ.png) no-repeat;
  82.     margin:0;
  83.     padding:0;
  84.     width:23px;
  85.     height:23px;
  86.     float:left;
  87. }
My Problem:
When the text in (div with a class of mm), currently 1<br />, goes outside the min-height it all gets mixed around. Example of error at mediafire Click Here to View
Jan 18 '08 #1
4 1512
drhowarddrfine
7,435 Expert 4TB
Which browser?
What doctype are you using?
Without the images, we can't duplicate this.

If the problem is in IE only, the problem may be min/max anything doesn't work in IE.
Jan 18 '08 #2
woody79
10
Happens in Internet Explorer 7(7.0.5730.13) and Firefox 2(2.0.0.11)
XHTML 1.0 Strict
By images do you this:
[url=http://www.mediafire.com/imageview.php?quickkey=1eh2rkrn0xy&thumb=4]

Jan 19 '08 #3
woody79
10
Rather than three in the middle i used one large one
Jan 19 '08 #4
drhowarddrfine
7,435 Expert 4TB
You didn't solve the problem, you only used a different method. The solution is easy but we don't have the images you used; I didn't mean you needed to post the images of the problem which you already linked to.
Jan 19 '08 #5

Post your reply

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

Similar topics

303 posts views Thread by mike420 | last post: by
17 posts views Thread by Doug Fort | last post: by
36 posts views Thread by Dmitriy Iassenev | last post: by
1 post views Thread by David Fitzjarrell | last post: by
12 posts views Thread by Marmagya | last post: by
10 posts views Thread by boomer | last post: by
5 posts views Thread by hendedav | last post: by
20 posts views Thread by Charles | last post: by
reply views Thread by NPC403 | last post: by
By using this site, you agree to our Privacy Policy and Terms of Use.