Printable View
How can I achieve something like this very old fashioned stuff with css
I do not want to use a fixed width for element (which might be a form or an image).HTML Code:<center>
<table border="1" bgcolor="xyz">
<tr><td>
<element />
</td></tr>
</table>
</center>
With a div, it uses the whole width of the window. If i set it to position:absolute; it has the right width, but I don't know, how to center it.
Hi,
Well you can imitate this behaviour quite easily in mozilla using display:table however IE doen't understand it, which is a big shame :(
The nearest you can get is using something like this:
But it does depend on what happens next and in this instance a table may be simpler :)Code:<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>Untitled Document</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<style type="text/css">
#outer {
margin:auto;
text-align:center;
display:table
}
.inner {
background:#ffffcc;
margin:5px;
padding:5px;
border:1px solid #000;
display:table;
}
* html .inner {display:inline;height:1%;position:relative;}/* for ie*/
</style>
</head>
<body>
<div id="outer">
<div class="inner">test</div>
</div>
</body>
</html>
Paul
Hi Paul
Thanks a lot for that quick answer. It works fine in Firefox.
Konqueror doesn't display that part at all.
When I remove the display:table from the .inner class, everything is fine in Konqueror and Firefox.
Any idea, why?
Gregor
Hi,
I don't have konqueror so I can't answer but if its fine without it then leave it out. It should still work ok and I've tested in my firefox and opera7.5 seems ok and wasn't really needed anyway.
Paul