Databases
StackOverflow2013
Postsdbo
POProblem with CSS and IE8, Box has an overflowing/repeating image in IE8 only! Please help!
Body
 

Note that there are some explanatory texts on larger screens.

plurals
  1. POProblem with CSS and IE8, Box has an overflowing/repeating image in IE8 only! Please help!
    text
    copied!<p>I have a problem with a few div boxes displaying an overflowing/repeating image only in Internet Explorer 8. It works fine in Chrome &amp; Firefox. </p> <p><strong>Link to an image of the Problem:</strong><a href="http://img220.imageshack.us/img220/2209/cssproblem.png" rel="nofollow">http://img220.imageshack.us/img220/2209/cssproblem.png</a></p> <p>I'm really not sure what's going on.. Note. In the image above I have highlighted the CSS classes that match their divs. Here is some of the CSS &amp; HTML code I'm using:</p> <p><strong>HTML:</strong> (Note: I have removed all the form elements inside the box because I removed it, and the problem still remained)</p> <p></p> <pre><code> &lt;div class="introtext"&gt; &lt;h1&gt;Where to Search?&lt;/h1&gt; &lt;/div&gt;&lt;!--introtext --&gt; &lt;div class="qms_search_container"&gt; &lt;div class="qms_search_header"&gt; &lt;h2 class="qms_search"&gt;What to Search?&lt;/h2&gt; &lt;/div&gt;&lt;!--#end qms_search_header--&gt; &lt;div class="qms_search_box" align="left"&gt; &lt;!--Form Stuff --&gt; &lt;/div&gt;&lt;!--#end qms_search_box--&gt; &lt;/div&gt;&lt;!--#end qms_search_container--&gt; &lt;/div&gt;&lt;!--#end intro_banner--&gt; </code></pre> <p><strong>CSS:</strong></p> <pre><code> .introbanner { background:url(../img/header_bg.gif) no-repeat bottom left #FFF; width:700px; height:230px; padding:0 0 30px 0; margin-bottom:10px; overflow:hidden; } .introtext { width:194px; float:left; color:#FFF; border-right:2px solid #FFF; height:206px; background:url(../img/intro_bg_left.gif) no-repeat top left #222935; padding:12px; } .qms_search_container { float:right; width:456px; height:206px; padding:12px; overflow:hidden; background:url('../public/frontend/img/area_banner.jpg') no-repeat top left #ffffff; } .qms_search_header { width:430px; height:32px; } .qms_search_header h2 { margin:0 0 0 0; padding:0; color:#FFF; font-weight:100; font-size:20px; background-image:none; height:auto; } .qms_search_box { width:436px; height:164px; background:url(../img/qms_search_bg.png); padding:5px; overflow:hidden; } </code></pre> <p>I've been stuck on this problem for so long now, Any help would be much appreciated!</p> <p>Thanks, Danny.</p>
 

Querying!

 
Guidance
An individual column

Larger individual text columns get their own page to allow for proper reading.

SQuiL has stopped working due to an internal error.

If you are curious you may find further information in the browser console, which is accessible through the devtools (F12).

Reload