marderiii Posted August 16, 2006 Share Posted August 16, 2006 The code below displays some simple square images -- however, there are spaces between the images... how can I get rid of them? <html><head><title>Map</title></head><body><body bgcolor="black"><img src="grass10-10.gif"><img src="grass10-10.gif"><img src="grass10-10.gif"><img src="grass10-10.gif"><img src="grass10-10.gif"><img src="grass10-10.gif"><img src="grass10-10.gif"><img src="grass10-10.gif"><img src="grass10-10.gif"><img src="grass10-10.gif"><br><img src="grass10-10.gif"><img src="grass10-10.gif"><img src="grass10-10.gif"><img src="grass10-10.gif"><img src="grass10-10.gif"><img src="grass10-10.gif"><img src="grass10-10.gif"><img src="grass10-10.gif"><img src="grass10-10.gif"><img src="grass10-10.gif"></body></html> test Link to comment Share on other sites More sharing options...
Cronthenoob Posted August 16, 2006 Share Posted August 16, 2006 that happens to me quite a bit also.The only thing that i found that fixes it is to:1.)Put every image in the same row of code2.)Put each row in its own table cell and set the padding and cellspacing to 0 <table cellpadding="0" cellspacing="0" border="0"> <tr> <td><img src="image.gif" /></td> <td><img src="image.gif" /></td> </tr></table> instead of putting that break, start a new <tr> tag.Try that. Link to comment Share on other sites More sharing options...
notclive Posted August 16, 2006 Share Posted August 16, 2006 in the head section put this <style type="text/css">img{border: 0px;margin: 0px}</style> that should work i think, even if it doesnt you should do that to stop firefox putting a border around themedit: the firefox thing only happens for links, i dont think my advice was right Link to comment Share on other sites More sharing options...
Jack McKalling Posted August 16, 2006 Share Posted August 16, 2006 The reason why this happens is quite simple. Every newline in HTML, is interpreted as a space. Next with all other space characters like tab, space, carriage return.If you keep those elements from getting on a new line in the code, then spaces won't come up between them on the page. However, all code on one line is not very readable.Attributes MAY have spacecharacters between them, those are not interpreted at all So if you do it like this: <body><img src=".." /><img  src=".." /><img  src=".." /><img  src=".." /><img  src=".." />etc</body>They all would come on one line at the page Link to comment Share on other sites More sharing options...
Cronthenoob Posted August 16, 2006 Share Posted August 16, 2006 Nice Dan. Never thought of that before!Keep that in mind. Link to comment Share on other sites More sharing options...
Jack McKalling Posted August 16, 2006 Share Posted August 16, 2006 At your service Link to comment Share on other sites More sharing options...
notclive Posted August 16, 2006 Share Posted August 16, 2006 that helps me toedit: one problem, i also get a space vertically when i use <br /> how can i stop that? Link to comment Share on other sites More sharing options...
marderiii Posted August 17, 2006 Author Share Posted August 17, 2006 i also get a space vertically when i use <br /> how can i stop that?Me too; I tried the style tags above, but they didn't seem to make a difference. I can get rid of the space between images on a line, but how about between images above and below each other? Link to comment Share on other sites More sharing options...
Cronthenoob Posted August 17, 2006 Share Posted August 17, 2006 <html><head><title>Map</title></head><body><body bgcolor="black"><table cellspacing="0" cellpadding="0" border="0"><tr><td><img src="grass10-10.gif"></td><td><img src="grass10-10.gif"></td><td><img src="grass10-10.gif"></td><td><img src="grass10-10.gif"></td><td><img src="grass10-10.gif"></td><td><img src="grass10-10.gif"></td><td><img src="grass10-10.gif"></td><td><img src="grass10-10.gif"></td><td><img src="grass10-10.gif"></td><td><img src="grass10-10.gif"></td></tr><tr><td><img src="grass10-10.gif"></td><td><img src="grass10-10.gif"></td><td><img src="grass10-10.gif"></td><td><img src="grass10-10.gif"></td><td><img src="grass10-10.gif"></td><td><img src="grass10-10.gif"></td><td><img src="grass10-10.gif"></td><td><img src="grass10-10.gif"></td><td><img src="grass10-10.gif"></td><td><img src="grass10-10.gif"></td></tr></table></body></html> Try that out Link to comment Share on other sites More sharing options...
Jack McKalling Posted August 17, 2006 Share Posted August 17, 2006 You don't have to use a whole table to be able to do this.Just adjust the margins in the stylesheet:img { margin:0; } Link to comment Share on other sites More sharing options...
marderiii Posted August 17, 2006 Author Share Posted August 17, 2006 Just adjust the margins in the stylesheet:img { margin:0; }That's what I have: <head><title>Map</title><style type="text/css">img{border: 0px;margin: 0px;}</style></head> But there are still spaces. Link to comment Share on other sites More sharing options...
Cronthenoob Posted August 17, 2006 Share Posted August 17, 2006 Tables would make it work.But people hate them for some reason. Link to comment Share on other sites More sharing options...
marderiii Posted August 17, 2006 Author Share Posted August 17, 2006 <tr>That works! Link to comment Share on other sites More sharing options...
Cronthenoob Posted August 17, 2006 Share Posted August 17, 2006 Is your webpage available online?Just curious what it looks like!If you don't want to link it, thats fine too! Link to comment Share on other sites More sharing options...
dorothy Posted August 19, 2006 Share Posted August 19, 2006 marderiii,Just curious. Is there a purpose to keep two body tags in your code! <body><body bgcolor="black">dorothy Link to comment Share on other sites More sharing options...
Jack McKalling Posted August 19, 2006 Share Posted August 19, 2006 That's what I have: <head><title>Map</title><style type="text/css">img{border: 0px;margin: 0px;}</style></head> But there are still spaces. Then you may have put in a linebreak between the images, which are interpreted as spaces on the webpage. Could you link your site, so we can see what is wrong? Link to comment Share on other sites More sharing options...
Recommended Posts
Create an account or sign in to comment
You need to be a member in order to leave a comment
Create an account
Sign up for a new account in our community. It's easy!
Register a new accountSign in
Already have an account? Sign in here.
Sign In Now