asked on
HTML / Image spacing problem
Alright, I'm pulling my hair out here...
Here is a page I'm having a problem with: http://www.fmgrinding.com/blank.html
See the spaces between the images in the navigation bar?
Now, here's a page without those spaces: http://www.fmgrinding.com/blank2.html
The ONLY difference that I can find between these two pages is the fact that the source code first (blank.html) is formatted for readability (indented, etc.) and in the second one, the source code for the navigation bar section is all run together. I've tried fixing this through CSS, etc. It seems that the only option I have is to remove all that whitespace, making the code impossibly difficult to read.
Why is this? I thought whitespace didn't bother HTML! This problem replicates across various browsers. Can anyone tell me what's happening here?
Thank you!
Here is a page I'm having a problem with: http://www.fmgrinding.com/blank.html
See the spaces between the images in the navigation bar?
Now, here's a page without those spaces: http://www.fmgrinding.com/blank2.html
The ONLY difference that I can find between these two pages is the fact that the source code first (blank.html) is formatted for readability (indented, etc.) and in the second one, the source code for the navigation bar section is all run together. I've tried fixing this through CSS, etc. It seems that the only option I have is to remove all that whitespace, making the code impossibly difficult to read.
Why is this? I thought whitespace didn't bother HTML! This problem replicates across various browsers. Can anyone tell me what's happening here?
Thank you!
Web Languages and StandardsWeb DevelopmentHTML
Last Comment
Valliappan AN
ASKER
Yes, altering the anchor tags in this way does work. I'd like a different approach though, if possible. What do you mean by "do formatting"?
ASKER CERTIFIED SOLUTION
THIS SOLUTION ONLY AVAILABLE TO MEMBERS.
View this solution by signing up for a free trial.
Members can start a 7-Day free trial and enjoy unlimited access to the platform.
Yes, white space characters does not bother HTML however you should be careful about "space"
HTML rendering engines strip off all white space characters but when they see consecutive whitespace characters (more then one space character for example), it keeps only one "space", render it on the canvas and remove the rest. Try this: Press SPACE BAR and TAB key several times between two words in your HTML file. Open the file in a browser. The result is a single space between words on the canvas of the browser. That's why you see a space between images when you format the code for readibility.
In your sample code, try to place as much enter/space/tab characters between ANCHOR or IMAGE tags. That makes no difference. Rendering engine places only one space between your images. Remove all white space between them and you'll get what you want
HTML rendering engines strip off all white space characters but when they see consecutive whitespace characters (more then one space character for example), it keeps only one "space", render it on the canvas and remove the rest. Try this: Press SPACE BAR and TAB key several times between two words in your HTML file. Open the file in a browser. The result is a single space between words on the canvas of the browser. That's why you see a space between images when you format the code for readibility.
In your sample code, try to place as much enter/space/tab characters between ANCHOR or IMAGE tags. That makes no difference. Rendering engine places only one space between your images. Remove all white space between them and you'll get what you want
'do formatting' - I meant that you can insert whitespaces and format the html, in other instances, where the whitespace does not affect the output.
Thanks.
Thanks.
Check your whitespaces between tags like :
<a><img src="default/004_experienc
Otherwise, you can do formatting.
Hope that helps.
Cheers.