butter .
butter .

Reputation: 1

Div with Span in td

I have a table which looks like this ...

<td>
<div style="float:left">
<img src="image1.png" style="display:block" /><br>
<img src="image2.png" />
</div>
<span> <input type="input" />
</td>


<td>
<div style="float:left">
<img src="image1.png" style="display:block" /><br>
<img src="image2.png" />
</div>
<span> <input type="input" />
</td>

I have set style=float to make the images and the input field in line.

But the problem is when I resize the brower, the div floats over the td which I don't want to have.

Is there any workaround for that problem??

Upvotes: 0

Views: 766

Answers (1)

Marc Uberstein
Marc Uberstein

Reputation: 12541

Firstly you have to check your html, close those tags (<span></span>) ;)

Secondly, when items are floating, the container will not read the height, so you have to add a clearer div underneath the floating items.

<div style='clear:both;'></div>

Example:

    <td>
    <div style="float:left">
    <img src="image1.png" style="display:block" /><br>
    <img src="image2.png" />
    </div>
    <div style='clear:both;'></div>
    <span> <input type="input" /> </span>
    </td>


    <td>
    <div style="float:left">
    <img src="image1.png" style="display:block" /><br>
    <img src="image2.png" />
    </div>
    <div style='clear:both;'></div>
    <span> <input type="input" /> </span>
    </td>

Upvotes: 1

Related Questions