Round corner div problem in IE7

Question

I am using following structure.

    <div style="background:#000 url(images/heading/bg.gif) repeat-x 0 0; height:28px; color:#FFF;">
    <div style="float:left; width:4px; background: #000 url(images/heading/left_curve.gif) no-repeat 0 left; height:28px;"></div>
    <span style="margin: 0 4px;">asdkjhkhasf</span>
    <div style="float:right; width:4px; background: #000 url(images/heading/right_curve.gif) no-repeat 0 right; height:28px;"></div>
    </div>
</div>    

In IE7, the right curve image(last div) is breaking to next line...

Please help me to resolve this issue.

Answer 1

交换跨度和右浮动div，以便div优先。

Answer 2

尝试在您的跨度中添加“ float：left”