In article David wrote:[color=blue]
> On this page I want to recreate table effect at the top of the page,
> with CSS. The effect is to have several components in a row, and the
> last cell in the row expand the width of the browser.
>
> I have recreated the effect using a CSS float, but when the browser is
> rezised he elements stack up, which I would prefer not to happen.[/color]
Why do you prefer that? It is usually much better if elements stack up.
[color=blue]
> Is there a way in CSS, other than absolutely positioning to get them
> to act in the same way as the table cells???[/color]
#container {display:table;}
#container * {display:table-cell;}
[color=blue]
>
http://homepage.ntlworld.com/davidp.hopkins/cells.htm[/color]
#container {min-width:<big-enaugh-number>px}
Neither works in IE.
http://www.svendtofte.com/code/max_width_in_ie/
This propably does also, but requires stupid empty div:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN">
<title>Test</title>
<style type="text/css">
#container .p1{float:left;width:100px;height:32px;
background:yellow;border: 1px solid blue}
#end {height:32px;background: #FF6835}
#foo {width:500px}
</style>
<div id="container">
<div id="foo"></div>
<div class="p1"></div>
<div class="p1"></div>
<div class="p1"></div>
<div class="p1"></div>
<div id="end"></div>
</div>
--
Lauri Raittila <http://www.iki.fi/lr> <http://www.iki.fi/zwak/fonts>
Saapi lähettää meiliä, jos aihe ei liity ryhmään, tai on yksityinen
tjsp., mutta älä lähetä samaa viestiä meilitse ja ryhmään.