Toggle sidebar Toggle sidebar
Become a MacRumors Supporter for $50/year with no ads, ability to filter front page stories, and private forums.

CSS, Tables, and weird Errors... (DailyTunes)

arn

arn

macrumors god
Original poster
Staff member
Hey all..

i'll be the first to admit that I'm a CSS novice. I don't know what the heck is going on.

Anyhow... there are some weird problems I've been having with the interaction between CSS div's and tables.

I've got <div>'s which make up the center portion of the Dailytunes site.

And Table's embeeded in the divs.

If I set the table at 100% width, it does some strange things on Windows IE.

compare:

http://www.dailytunes.com/

http://www.dailytunes.com/winie.php

The only diff is that winie has the first table with 100% width -- which is what I want actually. I managed to work around the problem on this page... but have been told of similar problems on other pages.

My solution for this page was to set the first <td> to 100% instead, and the <table> without a width (so it was auto).

But in other pages, I can't set the first <td> to 100%... it messes up the way the table looks.

arn
 
Have you tried replacing the table with <div>s? The only catch would be floating the album cover right, since you'd get rid of the <td> that puts it over there.

In my experience, using 100% width on tables or parts of tables is interpreted in very different ways by browsers. Some just take 100% of the area they are, some want 100% of the whole browser window.

If you want some help trying it out, let me know. I'll be home all day (work cancelled again due to the fires).
 
Placing a table width of 100% in a layer will throw IE (Mac & Win) out every time, I'm not sure why, but almost certainly it's a bug.

The only work around is to use pixel widths - not much help to you if you want a liquid page.

But then I can't see why you would want to use div tags in your design.
 
Originally posted by Lz0
Placing a table width of 100% in a layer will throw IE (Mac & Win) out every time, I'm not sure why, but almost certainly it's a bug.

The only work around is to use pixel widths - not much help to you if you want a liquid page.

But then I can't see why you would want to use div tags in your design.
Click to expand...

Well, if you're trying to replace tables, you use divs and CSS.
 
Workaround: add a div...

Setting the table width=100% doesn't work right in Internet Explorer on Windows. But if you wrap the table in a div and set that width to 100% and the table width to 100%, it seems to work...
 
Originally posted by Punboy
In the table's tag, put "style='width:100;'"

That may work
Click to expand...

You need some sort of size parameter (px, %, etc.) on widths. The only number that doesn't need (and shouldn't have) a unit measure is 0.
 
Arn - any closer?

Doesn't look like it based on those links...

Anyway, it's a fairly well known bug, iirc. Try changing your width to something other than 100% and see if that fixes it. If so, can you live with 99%? 😛

Also, as stated before, try style="width:100%" in the offending tag - that should do it.
 
You must log in or register to reply here.
Register on MacRumors! This sidebar will go away, and you'll see fewer ads.
Top Bottom
Back