How can I have each of these a elements break on to new lines, but keeping them as display=inline and without br tags?
<div>
<a href="element1">Element 1</a>
<a href="element1">Element 2</a>
<a href="element1">Element 3</a>
</div>
views:
108answers:
4
A:
Put them in an unordered list?
Not sure I really understand what you're after here...
Andrew Heath
2010-04-15 05:16:33
A:
<style type="text/css">
div.probablyShouldPutAClassName a {
display: block;
}
</style>
Ballsacian1
2010-04-15 05:27:10
+1
A:
This can be done, but will not work for all browsers. You need to use the :after pseudo-element with white-space and content. Like so
<html>
<head>
<style type="text/css">
div a:after {white-space: pre;content:'\A';}
</style>
</head>
<body>
<div>
<a href="element1">Element 1</a>
<a href="element1">Element 2</a>
<a href="element1">Element 3</a>
</div>
</body>
</html>
Jonathan
2010-04-15 05:30:21
A:
you can do this by defining equal width for the parent <div> and the <a>. assuming you apply a class 'container' to the <div>
.container { width: 100px; }
a { width: 100px; display: inline; }
pixeltocode
2010-04-15 09:01:04