469,362 Members | 2,367 Online
Bytes | Developer Community
New Post

Home Posts Topics Members FAQ

Post your question to a community of 469,362 developers. It's quick & easy.

image problem

Hi guys,
I've got a problem again, pesky css. I have a rounded box for a login. Its a
wrapper div containing three divs stacked on top of each other. In IE its
fine, but in FF the divs are seperated. I've tried IMG{display:block}, I've
tried IMG{vertical align:bottom}. I've set margins to 0, i've set line
height to 0. Now what?

http://www.paulwatt.info/test/supply/

Cheers

--

Paul Watt
http://www.paulwatt.info
Apr 21 '06 #1
17 1399

"Paul Watt" <pa**********@wattio.freeserve.co.uk> wrote in message
news:4a************@individual.net...
Hi guys,
I've got a problem again, pesky css. I have a rounded box for a login. Its
a wrapper div containing three divs stacked on top of each other. In IE
its fine, but in FF the divs are seperated. I've tried IMG{display:block},
I've tried IMG{vertical align:bottom}. I've set margins to 0, i've set
line height to 0. Now what?

http://www.paulwatt.info/test/supply/

Cheers


Dont worry, sorted it

cheers
Apr 21 '06 #2
Paul Watt wrote

"Paul Watt" <pa**********@wattio.freeserve.co.uk> wrote in message
news:4a************@individual.net...
Hi guys,
I've got a problem again, pesky css. I have a rounded box for a
login. Its a wrapper div containing three divs stacked on top of each
other. In IE its fine, but in FF the divs are seperated. I've tried
IMG{display:block}, I've tried IMG{vertical align:bottom}. I've set
margins to 0, i've set line height to 0. Now what?

http://www.paulwatt.info/test/supply/

Cheers


Dont worry, sorted it


That's a relief!

--
Charles Sweeney
http://CharlesSweeney.com
Apr 21 '06 #3
On Fri, 21 Apr 2006 10:44:18 +0100, "Paul Watt"
<pa**********@wattio.freeserve.co.uk> wrote:
Hi guys,
I've got a problem again, pesky css. I have a rounded box for a login. Its a
wrapper div containing three divs stacked on top of each other. In IE its
fine, but in FF the divs are seperated. I've tried IMG{display:block}, I've
tried IMG{vertical align:bottom}. I've set margins to 0, i've set line
height to 0. Now what?


Have you tried tables?

</gets coat>

Matt
--
Veritas Vincti
http://www.probertencyclopaedia.com
Apr 21 '06 #4
On 21 Apr 2006 10:59:59 GMT, Charles Sweeney <me@charlessweeney.com>
wrote:
Paul Watt wrote

"Paul Watt" <pa**********@wattio.freeserve.co.uk> wrote in message
news:4a************@individual.net...
Hi guys,
I've got a problem again, pesky css. I have a rounded box for a
login. Its a wrapper div containing three divs stacked on top of each
other. In IE its fine, but in FF the divs are seperated. I've tried
IMG{display:block}, I've tried IMG{vertical align:bottom}. I've set
margins to 0, i've set line height to 0. Now what?

http://www.paulwatt.info/test/supply/

Cheers


Dont worry, sorted it


That's a relief!


Thank heavens! I shall be able to sleep tonight, afterall!

Matt
--
Veritas Vincti
http://www.probertencyclopaedia.com
Apr 21 '06 #5
Paul Watt wrote:
"Paul Watt" <pa**********@wattio.freeserve.co.uk> wrote in message
news:4a************@individual.net...
Hi guys,
I've got a problem again, pesky css. I have a rounded box for a login. Its
a wrapper div containing three divs stacked on top of each other. In IE
its fine, but in FF the divs are seperated. I've tried IMG{display:block},
I've tried IMG{vertical align:bottom}. I've set margins to 0, i've set
line height to 0. Now what?

http://www.paulwatt.info/test/supply/

Cheers


Dont worry, sorted it

cheers


Umm, you may have fixed it /somewhere/ but not on the link above. Not
for me in the latest releases of Firefox and SeaMonkey.

--
Ed Mullen
http://edmullen.net
http://mozilla.edmullen.net
http://abington.edmullen.net
Boycott shampoo! Demand the REAL poo!
Apr 21 '06 #6

"Ed Mullen" <ed@edmullen.net> wrote in message
news:Tf******************************@comcast.com. ..
Paul Watt wrote:
"Paul Watt" <pa**********@wattio.freeserve.co.uk> wrote in message
news:4a************@individual.net...
Hi guys,
I've got a problem again, pesky css. I have a rounded box for a login.
Its a wrapper div containing three divs stacked on top of each other. In
IE its fine, but in FF the divs are seperated. I've tried
IMG{display:block}, I've tried IMG{vertical align:bottom}. I've set
margins to 0, i've set line height to 0. Now what?

http://www.paulwatt.info/test/supply/

Cheers


Dont worry, sorted it

cheers


Umm, you may have fixed it /somewhere/ but not on the link above. Not for
me in the latest releases of Firefox and SeaMonkey.


fixed on my local copy

paul
Apr 21 '06 #7
In article <44**************@news.ntlworld.com>,
Matt Probert <Via Usenet ONLY> wrote:
On Fri, 21 Apr 2006 10:44:18 +0100, "Paul Watt"
<pa**********@wattio.freeserve.co.uk> wrote:
I've got a problem again, pesky css. I have a rounded box for a login. Its a
wrapper div containing three divs stacked on top of each other. In IE its
fine, but in FF the divs are seperated. I've tried IMG{display:block}, I've
tried IMG{vertical align:bottom}. I've set margins to 0, i've set line
height to 0. Now what?


Have you tried tables?

</gets coat>


Actually that's a good suggestion. I see more consistency between
browsers in the way they display tables than the way they handle
CSS. It's gotten to the point where I'm about to give up on CSS for
layout, I'm so disgusted with how IE fails to conform to standards,
and I don't want to litter my pages with ridiculous hacks to
compensate for all the differences.

-A
Apr 21 '06 #8
To further the education of mankind, ax**@spamcop.net (axlq) vouchsafed:
Have you tried tables?

</gets coat>


Actually that's a good suggestion. I see more consistency between
browsers in the way they display tables than the way they handle
CSS. It's gotten to the point where I'm about to give up on CSS for
layout, I'm so disgusted with how IE fails to conform to standards,
and I don't want to litter my pages with ridiculous hacks to
compensate for all the differences.


Tables can be quite a pain, too. And the standards exist for the primary
reason (-whether the w3c realizes it or not) of making all (general web)
browsers work the same with the same markup. We're parsecs from that
utopean goal which will probably never be reached, but wouldn't it be nice
if you had something like a 98% level of confidence that some splotch of
markup would work identically in all browsers?

Css will evolve. I wouldn't give up too quickly.

--
Neredbojias
Infinity has its limits.
Apr 22 '06 #9
Paul Watt wrote:
I've tried IMG{vertical align:bottom}.

Dont worry, sorted it

Forget the hyphen, yes?

--
jmm (hyphen) list (at) sohnen-moe (dot) com
(Remove .AXSPAMGN for email)
Apr 22 '06 #10
axlq schreef:
In article <44**************@news.ntlworld.com>,
Matt Probert <Via Usenet ONLY> wrote:

[snipped]

Have you tried tables?

</gets coat>

Actually that's a good suggestion. I see more consistency between
browsers in the way they display tables than the way they handle
CSS. It's gotten to the point where I'm about to give up on CSS for
layout, I'm so disgusted with how IE fails to conform to standards,
and I don't want to litter my pages with ridiculous hacks to
compensate for all the differences.

-A


If you have to apply hacks, it will be in the stylesheet.
That means you don't have to litter your pages.

Rob
Apr 22 '06 #11
In article <44***********************@news.xs4all.nl>,
Rob_W <ro************@hotmail.com> wrote:
axlq schreef:
I'm so disgusted with how IE fails to conform to standards,
and I don't want to litter my pages with ridiculous hacks to
compensate for all the differences.


If you have to apply hacks, it will be in the stylesheet.
That means you don't have to litter your pages.


That's not quite true. Try making a CSS-only drop-down menu
(without using Javascript) that works the same under IE and other
browsers. All the examples I have seen required conditional markup
hacks in the document, as well as separate stylesheets for IE.

An excellent example of a cross-browser non-javascript CSS-only
drop-down menu is here:
http://www.cssplay.co.uk/menus/final_drop.html

It's quite nicely done, but it does require hacks in both CSS and
HTML.

-A
Apr 22 '06 #12
axlq wrote:
In article <44***********************@news.xs4all.nl>,
Rob_W <ro************@hotmail.com> wrote:

If you have to apply hacks, it will be in the stylesheet.
That means you don't have to litter your pages.


That's not quite true. Try making a CSS-only drop-down menu


And why would I even want to? Those things are a PITA to use - I
wouldn't want any of my users to suffer with them.

BTW, contrary to popular belief, making them with CSS instead of JS does
*not* automatically make them more accessible.

--
Reply email address is a bottomless spam bucket.
Please reply to the group so everyone can share.
Apr 23 '06 #13

On Fri, 21 Apr 2006 10:44:18 +0100, "Paul Watt"
<pa**********@wattio.freeserve.co.uk> wrote:
I've got a problem again, pesky css. I have a rounded box for a login. Its a
wrapper div containing three divs stacked on top of each other. In IE its
fine, but in FF the divs are seperated. I've tried IMG{display:block}, I've
tried IMG{vertical align:bottom}. I've set margins to 0, i've set line
height to 0. Now what?


I've just encountered a similar problem. What seems to be working is
eliminating all white space, including line breaks, between elements.
Otherwise, I get extra vertical space in Firefox and extra horizontal
space in Opera.

It would be nice if there were a white-space option to delete
white-space, so code like this code be formatted in a more readable
way.
--

Warren S. Sarle SAS Institute Inc. The opinions expressed here
sa****@unx.sas.com SAS Campus Drive are mine and not necessarily
(919) 677-8000 Cary, NC 27513, USA those of SAS Institute.
Apr 24 '06 #14
To further the education of mankind, sa****@unx.sas.com (Warren Sarle)
vouchsafed:

I've just encountered a similar problem. What seems to be working is
eliminating all white space, including line breaks, between elements.
Otherwise, I get extra vertical space in Firefox and extra horizontal
space in Opera.

It would be nice if there were a white-space option to delete
white-space, so code like this code be formatted in a more readable
way.


Yes, and I'd just like to add that Gecko seems to be pretty "lousy" in the
whitespace arena.

--
Neredbojias
Infinity has its limits.
Apr 24 '06 #15
Warren Sarle wrote:

What seems to be working is
eliminating all white space, including line breaks, between elements.
Otherwise, I get extra vertical space in Firefox and extra horizontal
space in Opera.
It is very possible that white space isn't the problem at all, but
simple margins. You may be assuming the element that appears to have
excess margins is the cause. Often, it is some other block near it instead.

This is no doubt true in the OP's case. He appears to think the img
element or its div container is the source of the gaps, when it is far
more likely the form and/or its paragraph elements are.
It would be nice if there were a white-space option to delete
white-space, so code like this code be formatted in a more readable
way.


FWIW, the only time I ever have trouble with white space is with WinIE
and list markup, notably with navigation menus. Gecko never gives me
trouble.

--
Reply email address is a bottomless spam bucket.
Please reply to the group so everyone can share.
Apr 24 '06 #16
"kchayka" <us****@c-net.us> wrote in message
news:4b************@individual.net...
Warren Sarle wrote:

What seems to be working is
eliminating all white space, including line breaks, between elements.
Otherwise, I get extra vertical space in Firefox and extra horizontal
space in Opera.
It is very possible that white space isn't the problem at all, but
simple margins. You may be assuming the element that appears to have
excess margins is the cause. Often, it is some other block near it
instead.

This is no doubt true in the OP's case. He appears to think the img
element or its div container is the source of the gaps, when it is far
more likely the form and/or its paragraph elements are.


In my particular case, that is not possible, since all the relevant margins
are explicitly set to zero, and the only elements involved are images
and divs.
FWIW, the only time I ever have trouble with white space is with WinIE
and list markup, notably with navigation menus. Gecko never gives me
trouble.


Gecko creates useless DOM text nodes whenever there is nothing but
white space between two div elements. IE omits the useless text nodes.
I don't know whether this is covered by the standards, but I certainly
find IE's behavior to make more sense in this case.
Apr 26 '06 #17
To further the education of mankind, "Warren Sarle" <sa****@unx.sas.com>
vouchsafed:
FWIW, the only time I ever have trouble with white space is with
WinIE and list markup, notably with navigation menus. Gecko never
gives me trouble.


Gecko creates useless DOM text nodes whenever there is nothing but
white space between two div elements. IE omits the useless text nodes.
I don't know whether this is covered by the standards, but I certainly
find IE's behavior to make more sense in this case.


Ah ha! I _knew_ there was a worm in the snifter somewhere.

What is the big problem with browsers doing what they're suppose to, namely
make white space transparent? I wouldn't think it was that high of a
mountain to climb.

--
Neredbojias
Infinity has its limits.
Apr 26 '06 #18

This discussion thread is closed

Replies have been disabled for this discussion.

Similar topics

15 posts views Thread by Anand Ganesh | last post: by
3 posts views Thread by Sandi | last post: by
2 posts views Thread by Andreas Viklund via DotNetMonster.com | last post: by
7 posts views Thread by lgbjr | last post: by
5 posts views Thread by Ricardo Furtado | last post: by
3 posts views Thread by kayahr | last post: by
1 post views Thread by CARIGAR | last post: by
reply views Thread by zhoujie | last post: by
reply views Thread by suresh191 | last post: by
1 post views Thread by Marylou17 | last post: by
By using this site, you agree to our Privacy Policy and Terms of Use.