<style type="text/css">
.section {
margin-top:15px;
display:block;
clear:both;
}
.acronym {
float:left;
width:100px;
border:1px solid gray;
}
.dash {
float:left;
width:15px;
border:1px solid gray;
}
.acr-explain {
float:left;
text-align:left;
border:1px solid red;
}
</style>
</head><body>
<p class="section">
<span class="acronym">Acronym 1</span>
<span class="dash">-</span>
<span class="acr-explain">Acronym 1 Explanation</span>
</p>
<p class="section">
<span class="acronym">Acronym 2</span>
<span class="dash">-</span>
<span class="acr-explain">Acronym 2 Explanation longer</span>
</p>
<p class="section">
<span class="acronym">Acronym 3</span>
<span class="dash">-</span>
<span class="acr-explain">Acronym 3 Explanation really long</span>
</p>
</body>Schalk Neethling wrote:
Keith
If Justin's does not do the trick try to float the acronym div left and the other right.
Then your styles: .acronym { float:left; width:200px; } .acr-explain { float:right; width:400px; text-align:left; }
Justin Reid wrote:
Keith:
li span { width: 200px; }
but this doesn't give me a 'default' box area to keep the acronyms in.
Any suggestions?
Have you also tried making the span block level in that scenario? -Justin Reid ______________________________________________________________________ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
______________________________________________________________________ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
