make divs appear side by side

Question

I am restructuring my tabular format data to show in divs. When I am assigning a css display:inline-block;, the divs are displaying side by side in IE8 but in IE6, its coming downwards.

Please help.

Thanks in advance.

If you actually have "tabular data" you should be using a table. — RoToRa, May 31 '11 at 10:34
You cannot use "inline-block" in IE6 as it is not supported! http://www.quirksmode.org/css/display.html — Ashwin Krishnamurthy, May 31 '11 at 10:40
As an update: Luckily, IE6 usage is down to 0.6% in the US and most of the rest of the world. Unless you are specifically targeting China, it can safely be ignored at this point. — Peter DeWeese, Jun 05 '12 at 14:41

score 4 · Answer 1 · edited May 23 '17 at 10:00

4

To make display: inline-block work in IE6, use this:

selector {
     display: inline-block;
     *display: inline;
     zoom: 1
}

Why does this work? See: Inline block doesn't work in internet explorer 7, 6

I am restructuring my tabular format data to show in divs.

I have to agree with the other comments - that is a bad idea.

You should use a <table> for tabular data - that's what they're for, semantically!

edited May 23 '17 at 10:00

Community

1
1

answered May 31 '11 at 10:47

thirtydot

217,782
47
385
346

Actually, in my current page, the div above the tabular data is not showing any scrollbar. So I was advised to convert the tabular data to divs, the header as a separate header div and the data table as a separate div. If there is a way to show a scrollbar on the table's parent div, I would be more than happy. – smukh Jun 01 '11 at 05:17

score 0 · Answer 2 · answered May 31 '11 at 10:29

0

You have to use display: block; float: left to achieve that in IE6. But be aware of the box-model problems with IE6 and the usage of width and padding.

But as a side note, if you have real tabular data, you should use <table>. There is no need to switch to <div> for that task.

answered May 31 '11 at 10:29

DanielB

19,386
2
42
49

Actually, in my current page, the div above the tabular data is not showing any scrollbar. So I was advised to convert the tabular data to divs, the header as a separate header div and the data table as a separate div. If there is a way to show a scrollbar on the table's parent div, I would be more than happy. – smukh Jun 01 '11 at 05:18
You should have had this information within your question. You could set the table parents div to a fixed height i.e. `height: 600px` and `overflow-y: scroll`, so the table parents div will have a vertical scrollbar. – DanielB Jun 01 '11 at 07:55

make divs appear side by side

2 Answers2