Hello all,
I want to specify dimensions for all images in a given web page, which I can do with CSS markup such as "height: 100px; width: 100px;"
In IE, this does what I want - if the image is not available, then an empty rectangular box appears instead, with those dimensions. This ensures the overall layout of the page is maintained.
However Firefox does not do this - if the image is not available then nothing comes up at all.
Can anyone advise on how I might get Firefox to behave like IE in this instance?
Cheers,
Ornette
You put it in the html.
You put it in the html. E.G.
This is a rare instance where putting presentational information in the html is necessary for good performance. Of course, if the image is not actual content it shouldn't be in the html in the first place, in which case you could do it all from CSS instead.
Thanks Ed, but no, not even
Thanks Ed,
but no, not even using the 'html' attribues will Firefox do this.
Its very annoying - is this supposed to be correct standards behaviour? Will I really be required to wrap every image in a div?
Ornette wrote:Thanks
Thanks Ed,
but no, not even using the 'html' attribues will Firefox do this.
Its very annoying - is this supposed to be correct standards behaviour? Will I really be required to wrap every image in a div?
Well, you have us working in the dark here. A link to the actual page would certainly help, but before you do that are you sure you have valid html and CSS? Both are necessary and invalid code often causes problems like this. One thing you can be pretty sure of, and that is if IE shows it one way and Firefox another way, 99% of the time it is IE that will be lying to you, never mind that you think IE has it the way it "should" look.
If you haven't read the sticky messages at the top of the forums now is the time to do so.
As an inline-replaced
As an inline-replaced element, the alternative to the image is the alt text, if available. Or, nothing, if nothing is specified. The alt text is just that, plain text. Firefox even allows you to style the alt text.
If you want the space preserved, you must make it a block element, i.e. float it. The border is up to you, and will appear with or without the image, if declared.
img { border: 1px solid #eee; float: left; height: 100px; width: 100px; }
cheers,
gary
Thanks for the replies. I
Thanks for the replies.
I just had a little fiddle whilst making this reply, and I have suddenly discovered that Firefox will display an empty rectanglar box for a missing image!! (given that 'height' and 'width' dimensions have been specified of course)
It turns out it was this doctype in my web page that was making missing images collapse to nothing when viewing in Firefox:
Having a correct doctype
Having a correct doctype declaration is one of our requirements for helping you in these forums. If you insist on not using them you should go for advice to a site where they will not call you out and will let you continue with out-of-date practices. A correct doctype, and prefereably a STRICT one, is not an option, it is a requirement. As is valid and preferably semantic html.
Read this article, as it is a "sticky" in this forum and you are expected to have read and understood it as a part of the deal in getting help here.
And, no, browsers are not rendering your code "correctly" without a doctype. Without a doctype there is no "correct", there are no standards and browsers can do what they want. The fact that it may look the way you want it to is beside the point.
"...but I could be wrong"I
"...but I could be wrong"
Ornette wrote:Quote:"...but
Quote:"...but I could be wrong"
I am saying that the removal of the doctype I have been using resolves the issue with Firefox not displaying a outline for explicitly dimensioned images when the image is not available!!!
So, yes, the doctype I have been using is precisely the cause of this unwanted effect.
Are you serious? You need a doctype. Maybe it fixes the FF error, but it also throws IE into Quirks Mode, so your next topic will be "I removed the DTD, why doesn't it work in IE?"
Removing the DTD is not an option. Put it back in and find the correct solution to the problem
Ornette wrote:I am saying
I am saying that the removal of the doctype I have been using resolves the issue with Firefox not displaying a outline for explicitly dimensioned images when the image is not available!!!
So, yes, the doctype I have been using is precisely the cause of this unwanted effect.
You are making a huge logical error that will only end up causing you hours and days of pain and trouble.
Removing the doctype actually causes browsers to go into "quirks" rendering mode where there are basically no standards at all, and therefore nothing to which you can expect browsers to conform.
The fact that you think doing that solved your problems is bad logic: "Post hoc, ergo propter hoc" is a logical fallacy so old that it has both a pretentious latin name and a Wikipedia entry.
I did something,
Then the problem went away
Therefore what I did solved the problem.
Common example:
My elbow hurt
I drank the urine of a virgin cow
Now my elbow doesn't hurt
Therefore, the urine of a virgin cow cured my elbow pain.
Very sloppy thinking. Well, you are welcome to your dream world if you like it, but if you do it's not very compatible with getting any useful help from this site.
Man, you are very
Man, you are very ignorant.
I have clearly seen that the particular doctype I have been using for my webpage - "XHTML strict" I believe - has caused an effect on the rendering of elements within the page that I do not desire.
Why is that so hard for you to accept?
If that is not the answer then why don't you provide a more logical one of your own???
Ornette wrote:Man, you are
Man, you are very ignorant.
I shall reply to that by referring you to an earlier post about the DTD:
http://www.csscreator.com/node/22010
in which I wrote
codemonk3y wrote:doctype wasn't the issue, as usual
Start respecting the forum rules and advice of people who give up their time for free or you'll soon find your questions ignored.
Ornette wrote:Man, you are
Man, you are very ignorant.
I am indeed ignorant of many things. I don't understand even more things. I don't, for instance, why someone coming to a site asking for help feels the need to reject advice and substitute his own beliefs. At least, if you are going to be doing that I don't understand why you are wasting your time asking for advice. And our time too.
I have clearly seen that the particular doctype I have been using for my webpage - "XHTML strict" I believe - has caused an effect on the rendering of elements within the page that I do not desire.
I can clearly see with my own eyes that the world, by and large, is flat. I know I asked you science fellows how to get from here to Russia but then you start giving me guff about great circles that I can plainly see are wrong. Now give me some good advice!
Why is that so hard for you to accept?
I think we both know which one of us is the one not doing the accepting around here... As I said, feel free to do as you like. When you get in trouble with that mistaken approach and come back asking for more help we might enjoy playing "I told you so" with you, but if so that would not reflect well upon us...
If that is not the answer then why don't you provide a more logical one of your own???
Uh, you refuse to give us what we, up front and explicitly, told you we need if we are going to help you, and then you complain that we aren't helping you!
Well, the doctor can prescribe you some pills, but he can't make you take them. If you choose not to take them it's a bit nervy, though, to then complain that the doctor's prescription isn't working!
All we ask for is valid html and valid html means a correct doctype. If you can't give us that fine, but why would you then get mad if we don't help you?
Oh for FFS why can noone
Oh for FFS
why can noone accept that I have discovered that in this instance, removing the doctype has addressed the problem?
Its like, as soon as I say that everyone shutsdown and starts going on about the importance of a valid doctype. Am I denying that though? I mean, honestly:
My page is already validated with a correct doctype and so on. It currently exists and is hosted on an internet site. I have recently come back to it to update it and iron out any niggles with it I am not happy about.
One of them is that I have discovered that in Mozilla Firefox,
i) given that I have applied specific dimensions to each image,
ii) and that the images are not available,
the browser does not, as I would normally expect, uphold an empty 'outlined' frame designating the space that the image would have assumed, but instead collapses that space to nothing.
This to me is not acceptable, if for instance a dial-up user is viewing my web page, then it is very possible that the images may not get loaded. In which instance I would still want the overall integrity of the page to be upheld, and for each missing image a empty, 'outlined' frame appears in its place.
I have posted about this, and have tried as suggested:
a) using the 'width' and 'height' properties within the actual HTML to address the issue, with no success.
b) contemplated 'floating' the images as also suggested, until realising that this would only mess up everything else.
Other than going with my own original 'lamented' option - enclosing every image within a 'div' and applying the dimentions to that instead, (something that would involve lots of unsightly extra markup and which would be an unappealing option), I have had no solution offered or any possible explanation or reason as why Firefox would not behave in the manner I (quite reasonably too, might I add) would expect it to.
By accident I discovered, by creating a simple webpage to illustrate the problem I am having, that without the presence of the "XHTML Strict" doctype that I was using in the original document, this unexpected and unwanted behaviour did not occur any more!
Why, why why why do you feel the need to argue against this simple, observed fact???
Am I denying the importance of having a valid and appropiate doctype in a webpage? Well?
The fact is that this particualr doctype is in this instance not appropiate for my needs. Instead of being all bolshie and pompous, why dont you direct your efforts into perhaps suggesting why this particular doctype would cause this unwanted behaviour, and even going as far as to perhaps suggesting something that would resolve this current issue I am facing????????
Ed Seedhouse wrote: I
I don't, for instance, why someone coming to a site asking for help feels the need to reject advice and substitute his own beliefs.
When, exactly, did I ever do that?
Uh, you refuse to give us what we, up front and explicitly, told you we need if we are going to help you, and then you complain that we aren't helping you!
What, exactly, did you "up front and explicitly" ask for did I not give you?
Ornette wrote:Ed Seedhouse
Ed Seedhouse wrote:I don't, for instance, why someone coming to a site asking for help feels the need to reject advice and substitute his own beliefs.
When, exactly, did I ever do that?
This whole thread.
Ed Seedhouse wrote:Uh, you refuse to give us what we, up front and explicitly, told you we need if we are going to help you, and then you complain that we aren't helping you!
What, exactly, did you "up front and explicitly" ask for did I not give you?
The entire code of your problem site, or a link to it. We ask for these in the "sticky" messages at the top of each forum message list, and we expect that folks will have read these before they post questions.
Ornette wrote:why can noone
why can noone accept that I have discovered that in this instance, removing the doctype has addressed the problem?
Because these folks have, between them. many many years of experience coding web pages. Because this is a site dedicated to helping people with CSS problems and that experience shows quite clearly that without a valid doctype and valid html no browser can be expected to follow any standard simply because, without these things, there is no standard to follow.
You choose to put your bad logic ahead of our advice. Fine, it's your life, and if you want to continue having more problems that's your privilege.
Frankly I think at this point the moderators should lock the topic because we're talking past each other and nothing is being said or heard and it's all become pointless. I, at least, hereby pledge not to post anything more on this thread. Bye.
Just before I lock (I won't
Just before I lock (I won't but lets pretend ) this thread as it's going nowhere;
In quirks mode the proscribed nature of the img element was display:block, this was changed with full standards mode to be display:inline, so removing the DTD as put your page into quirks mode thus FF will render the image set dimensions with no actual image supplying the dimensions, why IE still displays the image dimensions without an image present is a mystery known only to itself probably.
Gary supplied you with the answer earlier, set the img to display:block then it will honour the dimensions albeit without a border but that you can set yourself.
it's not that acurate to refer to this as a 'problem' it's not as such, but it will be a problem if you think that to solve this rather minor point it's worth shoving the whole page into quirks mode.
Hugo.
Lets now mark this thread as having run it's course please
I invoke 'Hitler' and 'Nazis'
Aw, bracklefratz! Thread
Aw, bracklefratz!
Thread closed.
gary
Hugo wrote: In quirks mode
In quirks mode the proscribed nature of the img element was display:block, this was changed with full standards mode to be display:inline, so removing the DTD as put your page into quirks mode thus FF will render the image set dimensions with no actual image supplying the dimensions, why IE still displays the image dimensions without an image present is a mystery known only to itself probably.
Hugo wins the internet.
Thread over.