4

My code is as follows:

<table>
    <tr>
        <td>
            <div id='lunch'><a href='Lunchplace.aspx?c=1&id=110'><img style='margin-top: 3px;' src='./images/115x52_Brasseriet.jpg'class='imagealign'/><b>Brasseriet</b><br />Köttbullar med gräddsås & kokt pota...&nbsp;<span style='color:#f29400;font-size:small;float:right;'>80 Kr<span style='float:right;'>70 Kr</span>&nbsp;&nbsp;&nbsp;&nbsp;</span><br />Kycklinggryta med örtcremefraishe &...&nbsp;<span style='color:#f29400;font-size:small;float:right;'>80 Kr<span style='float:right;'>70 Kr</span>&nbsp;&nbsp;&nbsp;&nbsp;</span><br />Paj, Lasagne, Räksallad, Kycklingsa...&nbsp;<span style='color:#f29400;font-size:small;float:right;'>79 Kr<span style='margin-right:40px'></span></span></div>
        </td>
    </tr>
    <tr>
        <td><img src='./images/siteimages/linje_430.jpg'/></td>
    </tr>
</table>

And it looks aweful in ie7, All other browsers render it correct, but it seems that ie7 make row breaks at the spans, even though the spans are inline elements.. Ill add a picture so you can understand!

example of problem http://img2.imageshack.us/img2/3130/humm.png

I'm sure you can see my problem!

As reply to rocket ronny Heres the code as it looks now(Auto generated some parts)

 Lunches = Lunches + "<table cellspacing='0' cellpadding='0' width='500px;'><tr> <td><div id='lunch'><a href='Lunchplace.aspx?c=1&id=110'><img style='margin-top:3px;' src='./images/" + Img + "'class='imagealign'/><strong>" + k.Name + "</strong><br />" + checkLength(k.Monday) + "&nbsp;" + "<span style='color:#f29400; font-size:small; float:right;'>" + checkZero(k.Monday, k.PriceMonS, 1).ToString + checkZero(k.Monday, k.PriceMonGet, 2).ToString + "</span>&nbsp;&nbsp;&nbsp;&nbsp;</span><br />" + checkLength(k.Monday2) + "<span style='color:#f29400; font-size:small;float:right;'>" + checkZero(k.Monday2, k.PriceMon2S, 1).ToString + checkZero(k.Monday2, k.PriceMon2Get, 2).ToString + "</span>&nbsp;&nbsp;&nbsp;&nbsp;<br />" + checkLength(k.Monday3) + "<span style='color:#f29400;font-size:small;float:right;'>" + checkZero(k.Monday3, k.PriceMon3S, 1).ToString + checkZero(k.Monday3, k.PriceMon3Get, 2).ToString + "</span></div></td></tr><tr><td><img src='./images/siteimages/linje_430.jpg'/></td></tr></table>"

This was the code you said would work, but it looks the same as usual.

Here's the original code auto generated:

Lunches = Lunches + "<table> <tr> <td><div id='lunch'>" + "<a href='Lunchplace.aspx?c=" + city.ToString + "&id=" + k.ResturantID.ToString() + "'><img style='margin-top: 3px;' src='./images/" + Img + "'class='imagealign'/>" + "<b>" + k.Name + "</b>" + "<br />" + checkLength(k.Monday) + "&nbsp;" + "<span style='color:#f29400;font-size:small;text-align:right;'>" + checkZero(k.Monday, k.PriceMonS, 1).ToString + checkZero(k.Monday, k.PriceMonGet, 2).ToString + "</span><br />" + checkLength(k.Monday2) + "&nbsp;" + "<span style='color:#f29400;font-size:small;text-align:right'>" + checkZero(k.Monday2, k.PriceMon2S, 1).ToString + checkZero(k.Monday2, k.PriceMon2Get, 2).ToString + "</span><br />" + checkLength(k.Monday3) + "&nbsp;" + "<span style='color:#f29400;font-size:small;text-align:right;'>" + checkZero(k.Monday3, k.PriceMon3S, 1).ToString + checkZero(k.Monday3, k.PriceMon3Get, 2).ToString + "</span></div></td></tr><tr><td><img src='./images/siteimages/linje_430.jpg'/></td></tr></table>"
1
  • The code is hardly readable. You can use an online HTML formatter to fix this. Oct 18, 2010 at 12:58

2 Answers 2

4

Your 'inner' span has a css property of float:right; - this is causing the line breaks in IE

the code below should work.

<table cellspacing="0" cellpadding="0"> 
    <tr> 
        <td>
            <div id="lunch">
                <a href='Lunchplace.aspx?c=1&id=110'><img style="margin-top: 3px;" src="./images/115x52_Brasseriet.jpg'class='imagealign"/><strong>Brasseriet</strong>
                <br />Köttbullar med gräddsås &amp; kokt pota... &nbsp; <span style="color:#f29400; font-size:small; float:right;">80 Kr<span style="margin-left:20px;">70 Kr</span>&nbsp;&nbsp;&nbsp;&nbsp;</span>
                <br />Kycklinggryta med örtcremefraishe &amp;... &nbsp; <span style="color:#f29400; font-size:small;float:right;">80 Kr<span style="margin-left:20px;">70 Kr</span>&nbsp;&nbsp;&nbsp;&nbsp;</span>
                <br />Paj, Lasagne, Räksallad, Kycklingsa... &nbsp; <span style='color:#f29400;font-size:small;float:right;'>79 Kr<span></span>&nbsp;&nbsp;&nbsp;&nbsp;</span>
            </div>
        </td>
    </tr>

    <tr>
        <td>
            <img src='./images/siteimages/linje_430.jpg'/>
       </td>
    </tr>
</table>
2
  • Hmm, didnt seem to work... The code i submitted is auto generated.... but ill show both codes as they look now.
    – Jimmy
    Oct 18, 2010 at 13:06
  • well its deffo the inner span float thats causing the issue, try removing all styles from it (the inner span), and working from there Oct 18, 2010 at 13:15
1

Your row is breaking because of the "float:right;" CSS attribute you have on the span element. Possibly adding style="clear:both" to your TD flag will fix this

1
  • It did not, Any more ideas? or any other way i can do it?
    – Jimmy
    Oct 18, 2010 at 12:03

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Not the answer you're looking for? Browse other questions tagged or ask your own question.