IE vs Firefox >>> background handling

HTML & CSS
1

I have a small form with validation. The validation appears below the form and extends the forms containing div.

In firefox it handles it like this:

Internet Explorer handles it like this:

I much prefer the way it is handled by firefox, how it doesn’t extend the background image. Is there a way to get IE to make it appear the same way ?

2

Certainly, but we would need to see a link (or some code) to know what’s causing this.

3

i’m not exactly sure if this will work, but probably you could try background-repeat:no-repeat; or background-repeat:repeat-x; ??

4

oops hahaha… the link is http://www.rdenergysolutions.ca/?page_id=210

Thanks :slight_smile:

5

I just placed the validation div outside the main div with the background and that works fine.

6

OK, good. Nice site! But just to let you know, Firefox is alerting me to some errors, such as “border-borrom” (line 62), “paddind-left” (line 213) and a few other bits and bods. Time for some validation! :wink:

7

haha thanks… I’m getting there :slight_smile:

8

The most probable cause is that you had floated elements within the bottom part of hte gray div (I’m looking at hte IE image)

On the parent you must have set haslayout (a width or someting) and as a result IE contained the floats.

FF was correct in not containing the floated elements.

You could have restructured as you said, or add an extra parent and place the background on that element instead of on the other parent :slight_smile: