Table within a <div>

P

Paul Watt

Hi,

i've placed a table within a <div> to dispay some data.
All is well in FF, but in MSIE the table starts inline with the bottom of
the <div> to the left. I've set the css div to vertical align: top, but this
hasn't made a differance.

http://www.paulwatt.info/test/calendar.htm

Thanks guys
 
Joined
Feb 4, 2010
Messages
28
Reaction score
0
Have you tried experimenting with CSS "margin" and "padding" also?

As these aren't always treated consistently across browsers.
 
P

Paul Watt

Have you tried experimenting with CSS "margin" and "padding" also?

As these aren't always treated consistently across browsers.

Sorted now, thanks. used negetive margins and the underscore hack in the
end.
 
K

kchayka

Paul said:
used negetive margins and the underscore hack in the end.

Sounds very much like you are treating the symptoms, not the problem.
That is surely the wrong way to go about it.
 
P

Paul Watt

kchayka said:
Sounds very much like you are treating the symptoms, not the problem.
That is surely the wrong way to go about it.

What would you suggest?
 
J

Jim Moe

Paul said:
i've placed a table within a <div> to dispay some data.
All is well in FF, but in MSIE the table starts inline with the bottom of
the <div> to the left. I've set the css div to vertical align: top, but this
hasn't made a differance.

http://www.paulwatt.info/test/calendar.htm
IE does not always correctly flow blocks. I'm a little vague on the
specifics but IIRC it miscalculates the available horizontal space
thinking there is not enough for, say, a table whose width is 100%.
A couple of things to try:
1. Float the .content div
2. Set the table's width to less than 100%, or do not use a width at all

BTW "vertical-align: top" is meaningless for a div.
 
D

dorayme

John Bokma said:
If it's an IE only issue (make sure that it really is) then you don't use
hacks, you use "conditional comments":

<http://virtuelvis.com/archives/2004/02/css-ie-only>

Hacks are ugly.

Well, maybe it is a matter of taste... on reflection, are hacks
per se ugly, and does it matter? What matters objectively is that
something relatively simple works, that it is not going to be a
nuisance later. This latter possibility is a serious one.

Ugly is in the eye of the beholder on this one, I don't find them
that ugly, they have been cleverly found and work and I am
reminded of this when I see them and I look on admiringly. They
are simpler in many ways than making separate style sheets just
for this IE or that IE and IE in common.

I am not advocating them here. I just think it is a bit precious
to refrain from fighting something ugly (IE rendering standards)
in too prim and proper a manner. There is an argument here that
the remedy rather nicely fits the cause.

And really, when push comes to shove, they are broadly
conditional defences against specific nuisances.
 
G

GreyWyvern

And lo, John Bokma didst speak in
alt.html,alt.www.webmaster,comp.infosystems.www.authoring.stylesheets:
dorayme said:
John Bokma wrote:
[..]
Hacks are ugly.

Well, maybe it is a matter of taste...

No it isn't. If you can do the same thing with a conditional comment, do
it with a conditional comment.

IIRC, IE/Mac does not support IE conditional comments. If you are
comfortable with excluding that (small and shrinking) market share, then
yesh, conditional comments are preferable to IE hacks.

Grey
 
I

Ian Collins

GreyWyvern said:
And lo, John Bokma didst speak in
alt.html,alt.www.webmaster,comp.infosystems.www.authoring.stylesheets:
dorayme said:
John Bokma wrote:

[..]

Hacks are ugly.


Well, maybe it is a matter of taste...


No it isn't. If you can do the same thing with a conditional comment, do
it with a conditional comment.


IIRC, IE/Mac does not support IE conditional comments. If you are
comfortable with excluding that (small and shrinking) market share,
then yesh, conditional comments are preferable to IE hacks.
It (IE/Mac) doesn't suffer the same CSS bugs as IE/windows, does it? So
the lack of conditional comment support might be a good thing in this case.
 
T

trippy

Paul Watt took the said:
Hi,

i've placed a table within a <div> to dispay some data.
All is well in FF, but in MSIE the table starts inline with the bottom of
the <div> to the left. I've set the css div to vertical align: top, but this
hasn't made a differance.


vertical-align:top

You need the dash in there.

--
trippy
mhm31x9 Smeeter#29 WSD#30
sTaRShInE_mOOnBeAm aT HoTmAil dOt CoM

NP: "Rhythm From A Red Car" -- Hardline

"Now, technology's getting better all the time and that's fine,
but most of the time all you need is a stick of gum, a pocketknife,
and a smile."

-- Robert Redford "Spy Game"
 
J

Jim Moe

Jim said:
A couple of things to try:
1. Float the .content div
2. Set the table's width to less than 100%, or do not use a width at all
I decided to look at this more closely.
Change the table's width to 99%.
 
T

Toby Inkster

John said:
No it isn't. If you can do the same thing with a conditional comment, do
it with a conditional comment.

Conditional comments *are* a hack. They're more reliable than many other
hacks, but hacks all the same.
 
N

Neredbojias

To further the education of mankind, Toby Inkster
Conditional comments *are* a hack. They're more reliable than many
other hacks, but hacks all the same.

One could say they're a heck of a hack...
 
K

kchayka

John said:
If it's an IE only issue (make sure that it really is) then you don't use
hacks, you use "conditional comments":

I wouldn't leave it to this particular OP to determine it really is an
IE only issue. He isn't adept enough at CSS to know. Given time, maybe.

Hacks are ugly.

As someone else pointed out, conditional comments are indeed a hack, but
cluttering up the HTML instead of the CSS. Personally, I'd rather have
that kind of clutter in one CSS file instead of embedded on every page.

BTW, since IE7 does sooooooo much better at CSS than IE6 does, I have
found the *html hack to be most excellent. IE7 ignores it, and applies
the standard CSS rules other browsers get. Beautiful. :)
 
K

kchayka

Jim said:
I decided to look at this more closely.
Change the table's width to 99%.

Better is to set no width at all, methinks. He set a 10px left margin on
the table. When added to 99%, it comes out to something more or less
than 100%. I get a horizontal scrollbar with IE.
 
A

Alan J. Flavell

BTW, since IE7 does sooooooo much better at CSS than IE6 does, I
have found the *html hack to be most excellent. IE7 ignores it, and
applies the standard CSS rules other browsers get. Beautiful. :)

I seem to recall reading somewhere that we were urged to show no mercy
to IE7, but to treat it as if it were a real WWW browser. If that's
the official policy, I'm only too happy to stick to it ;-)

[yes, I know it still has lots of non-standard features, including
some cases where it violates mandatory requirements of the relevant
specifications. But if we're supposed to treat it like a WWW browser,
so be it. Or perhaps that was only the beta? ]
 

Ask a Question

Want to reply to this thread or ask your own question?

You'll need to choose a username for the site, which only take a couple of moments. After that, you can post your question and our members will help you out.

Ask a Question

Members online

No members online now.

Forum statistics

Threads
473,744
Messages
2,569,484
Members
44,903
Latest member
orderPeak8CBDGummies

Latest Threads

Top