Want to win a PS4? Go Premium and enter to win our High-Tech Treats giveaway. Enter to Win

x
?
Solved

HTML, Image Tag placing

Posted on 2009-04-06
15
Medium Priority
?
219 Views
Last Modified: 2012-05-06
Hi

Why does the following happen:
<table cellpadding=0 cellspacing=0>
    <tr>
         <td>
                 <img src="xyz.gif">
          </td>
    </tr>
    <tr>
         <td>
                 <img src="xyz.gif">
          </td>
    </tr>
</table>

The above leave a space between the images, but the below does not:
<table cellpadding=0 cellspacing=0>
    <tr>
         <td><img src="xyz.gif"></td>
    </tr>
    <tr>
         <td><img src="xyz.gif"></td>
    </tr>
</table>

?
0
Comment
Question by:skrombeen
[X]
Welcome to Experts Exchange

Add your voice to the tech community where 5M+ people just like you are talking about what matters.

  • Help others & share knowledge
  • Earn cash & points
  • Learn & ask questions
  • 9
  • 5
15 Comments
 
LVL 14

Expert Comment

by:theras2000
ID: 24076690
That is odd.  I didn't realise that would happen either.
With a little testing, I can see that it is because your first </td> is on a new line.  In fact, even if there is just one space between the <img> and the </td> it seems to do this.  The Opening <td> seems to make difference.  I'm using IE7 BTW.
0
 
LVL 1

Author Comment

by:skrombeen
ID: 24076727
thanks for that prompt response...yip, im also on ie7...i've noticed on FireFox it doesn't have that problem...
0
 
LVL 16

Expert Comment

by:rbudj
ID: 24078651
I am getting the same result with ff3 and ie7.  Do you have a doc type in your page?
0
VIDEO: THE CONCERTO CLOUD FOR HEALTHCARE

Modern healthcare requires a modern cloud. View this brief video to understand how the Concerto Cloud for Healthcare can help your organization.

 
LVL 16

Expert Comment

by:rbudj
ID: 24078660
... by same result I mean there is no additional space.  Each table is identical.
0
 
LVL 1

Author Comment

by:skrombeen
ID: 24078949
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
0
 
LVL 16

Expert Comment

by:rbudj
ID: 24078983
can you post a screenshot of the spaces you see?
0
 
LVL 16

Expert Comment

by:rbudj
ID: 24079070
ok, i got it now.  What is happening is you have a space in the first table.  You have lots of spaces but html only allows one blank space.  All other spaces have to use the &nbsp; This is the same concept as a space between your text.  You can type text separated by a space without using the &nbsp;

So... in the second table, you have removed the one allowed space.

0
 
LVL 16

Accepted Solution

by:
rbudj earned 2000 total points
ID: 24079099
notice the code below.  Your browser is seeing a space at the end of your image just before the closing </td>  The code below is the same as above
<table cellpadding=0 cellspacing=0>
    <tr>
    <td><img src="xyz.gif"> </td>
    </tr>
    <tr>
    <td><img src="xyz.gif"> </td>
    </tr>
</table>

Open in new window

0
 
LVL 1

Author Comment

by:skrombeen
ID: 24079215
Here is the image
Spaces.jpg
0
 
LVL 1

Author Comment

by:skrombeen
ID: 24079250
Hi rbudj,

If i type the code all in 1 line, then on visual studio i select format code...and it shifts it around to make the indents follow, etc... at that point the additional spaces come in?

thanks
Shaun
0
 
LVL 16

Expert Comment

by:rbudj
ID: 24079284
apparently so.  Not all WYSIWYG's are perfect.  This space is coming from somewhere and must be coming from VS.
0
 
LVL 16

Expert Comment

by:rbudj
ID: 24079330
if you place your cursor at the end of the first <img src="xyz.gif"> and press delete until the </td> is right next to the <img src="xyz.gif"> such as <img src="xyz.gif"></td> you will see the extra space disappears.  This is most certainly a flaw in VS.  Apparently, it thinks you want a space after each element.
0
 
LVL 16

Expert Comment

by:rbudj
ID: 24079335
btw, you may be able to prevent this extra space by defining or undefining it somewhere in your preferences.  
0
 
LVL 1

Author Comment

by:skrombeen
ID: 24079399
thanks, any idea on the setting?
0
 
LVL 16

Expert Comment

by:rbudj
ID: 24079720
im not sure as I use Dreamweaver for my designs but it should be close to Tools > Options >Text Editor > All Languages > General

Look for something about line spacing.  You will just have to try different related options and test them.
0

Featured Post

Keep up with what's happening at Experts Exchange!

Sign up to receive Decoded, a new monthly digest with product updates, feature release info, continuing education opportunities, and more.

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

This article discusses four methods for overlaying images in a container on a web page
Without even knowing it, most of us are using web applications on a daily basis.  In fact, Gmail and Yahoo email, Twitter, Facebook, and eBay are used by most of us daily—and they are web applications. We generally confuse these web applications to…
In this tutorial viewers will learn how to code links for mobile sites that, once clicked, send a call or text to a specified number. For a telephone link (once clicked, calls a number), begin with a normal "<a href=" link tag. For the href, specify…
Learn how to create flexible layouts using relative units in CSS.  New relative units added in CSS3 include vw(viewports width), vh(viewports height), vmin(minimum of viewports height and width), and vmax (maximum of viewports height and width).

604 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question