I'd like to know how to get a homogeneous horizontal arrangement of
images. The number of images is sometimes 3, sometimes 4.
First I thought of display:table-cell, but that would require a
inline-block-solution for IE lte 7 anyway. And it would force a
table-row, a one-liner.
Here, I'm trying to solve with text-align:justify. Since any last line
of justified text isn't justified, I had to insert a span to emulate a
last line.
But I have the feeling there must be something much simpler. Did not
test if it is stable.
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd";>
<html xmlns="http://www.w3.org/1999/xhtml"; xml:lang="en" lang="en">
<head>
<title></title>
<meta http-equiv="content-type" content="text/html; charset=utf-8" />
<meta name="author" content="Ingo Chao" />
<style type="text/css">
#wrapper {
text-align: justify;
width: 100%;
overflow-x: hidden; /* IE hor. scrollbar */
}
img {
border: 1px solid red;
padding: 5px;
vertical-align: middle;
}
#wrapper span {
display: inline;
display: inline-block; /*Opera*/
padding-left: 100%; /*force a new line*/
}
</style>
</head>
<body>
<div id="wrapper">
<img src="#" alt="image" />
<img src="#" alt="image" />
<img src="#" alt="image" />
<img src="#" alt="image" />
<span><!----></span>
</div>
</body>
</html>
--
http://www.satzansatz.de/css.html
______________________________________________________________________
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
List policies -- http://css-discuss.org/policies.html
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
