If you had a look at this forum http://python-forum.org/pythonforum/, you could notice that borders which Topics and Posts divs have are short. I am writting a forum and now have a problem with blocks which must go side by side (just like those four at the above mentioned forum). Could you please help me arrange four blocks side by side so that my forum wouldn't have that sort of shortness.
A:
This is the CSS style of the <dd> element that you are requesting:
UL.topiclist DD
{
PADDING-RIGHT: 0px;
DISPLAY: block;
PADDING-LEFT: 0px;
FLOAT: left;
PADDING-BOTTOM: 4px;
BORDER-LEFT: #ffffff 1px solid;
PADDING-TOP: 4px
}
The important one to get it side by side is FLOAT: left;.
The short vertical line, is just the border-left.
awe
2009-09-03 07:44:34
i recommend `display:inline` on your floats. (This will be essentially ignored, as floats are implicitly blocks.) This is for the benefit of IE; otherwise you'll get the double-margin bug. http://www.positioniseverything.net/explorer/floatIndent.html
Funka
2009-09-03 07:51:54
@awe: yes, the short vertical line is a border-left. and it's short.
2009-09-03 07:54:58
@Sweetie: If you wonder why it's short, it's just that the `<dd>` element is not in the full height of the "row". You should look at the html source to see how it is done.
awe
2009-09-03 08:01:23
Yeah, how to get it to be full height in that case?
2009-09-03 08:10:30
I know why. I wonder how to do it 'right'.
2009-09-03 08:11:33
+2
A:
You should use tables.
There are only a few cases in which the use of a table is allowed (if you go by the semantic html rules), and this is one. The overview of forums, amount of posts and views, last poster, etc is a set of tabular data. It's safe and perfectly acceptable to use tables.
The <dl> element however was not intended to be used in this way.
Litso
2009-09-03 14:28:45