Tek-Tips is the largest IT community on the Internet today!

Members share and learn making Tek-Tips Forums the best source of peer-reviewed technical information on the Internet!

  • Congratulations gkittelson on being selected by the Tek-Tips community for having the most helpful posts in the forums last week. Way to Go!

tables/layout

Status
Not open for further replies.

z35

Programmer
Dec 21, 2001
206
US
Hi,

I am having a problem with tables. If you go to gap.com
all the graphics and pieces are aligned perfectly. The photos have the same exact amount of space between them down to the pixel. It makes the web site look very neat and professionally designed.

My tables are not spacing like this. Please please help me with my code.

you can view my html page at:

Thanks for all help.
 
I'm not sure what you mean by gap's site being perfectly aligned and yours not. You may want to explain a bit more what's bothering you exactly!
Anyway if you are not happy with the spaces between pix, you can take out the hight and width values in that table.
 
Hi all,

I also don't have a clue what you mean but I have a question..

Why are you using two tables when one would do the same job?? Both the same size and the only difference I can see is that the first has a border.. This border could be simply added to the second table..

There is no point to this..

Hope this helps Wullie

 
You could try to validate your code, theres a number of errors, fix these and it should help.

-style has no type attribute

-table shouldn't use height

-you have height="152.5" this is invalid!

-you have mixed font tags with CSS, i think stick to one or the other, not both IMHO. instead of:
<font size=&quot;2&quot;color=&quot;#6b6b6b&quot;><div align=&quot;center&quot;>Contact Us
leave out the font tag and use
<div align=&quot;center&quot; class=&quot;footer&quot;>Contact Us
then define the style in your header.

-you should include summary=&quot;&quot; on tables, and alt=&quot;&quot; on images.

-you have a <td > i'm not sure if the space has any effect but its best to keep the code clean.


Hope it helps!




É
<!--#include file=&quot;profound quotation&quot; -->
 
This is what I would do with your center tables, to start:

<!-- Outer table -->
<table summary=&quot;&quot; width=&quot;750&quot; border=&quot;1&quot; bordercolor=&quot;#6b6b6b&quot; cellpadding=&quot;0&quot; cellspacing=&quot;0&quot; align=&quot;center&quot;>
<tr>
<td align=&quot;center&quot; valign=&quot;middle&quot;>
<!-- inner table -->
<table summary=&quot;&quot; width=&quot;100%&quot; border=&quot;0&quot; cellpadding=&quot;0&quot; cellspacing=&quot;0&quot; align=&quot;center&quot;>
<tr bgcolor=&quot;#c9dbed&quot;>
<td rowspan=&quot;2&quot; align=&quot;center&quot; valign=&quot;middle&quot;>
<img src=&quot;Mod-D-1.jpg&quot; width=&quot;410&quot; height=&quot;307&quot; alt=&quot;&quot; title=&quot;&quot;>
</td>
<td align=&quot;center&quot; valign=&quot;middle&quot;>
<img src=&quot;53Y-0.jpg&quot; width=&quot;334&quot; height=&quot;152&quot; alt=&quot;&quot; title=&quot;&quot;>
</td>
</tr>
<tr bgcolor=&quot;#c9dbed&quot;>
<td align=&quot;center&quot; valign=&quot;middle&quot;>
<img src=&quot;Milos-3.jpg&quot; width=&quot;334&quot; height=&quot;152&quot; alt=&quot;&quot; title=&quot;&quot;>
</td>
</tr>
</table><!-- end inner table -->
</td>
</tr>
</table><!-- end outer table -->

There will be some blank space at the bottom of the table, get rid of this by removing the spaces in the code.

You will need to tweek the tables a little, maybe also alter the heights of your images so they fit better,
i think you tried to do this, just dont use decimals!
You could remove the width attribute from the main table, it will fit to the images anyway.



É
<!--#include file=&quot;profound quotation&quot; -->
 
Hello...I think those are very good points to fix in my code.

but regarding the original problem...let me explain.

the space from the left of the table to my photo is less than the space from the top of the table to my photo.

The space between the 2 photos on the right side is also different from the other spaces.

I know it is a small difference...but if the numbers are defined down to the pixel...it should look exact.

the gap site is exact. please help...thanks.


 
Status
Not open for further replies.

Part and Inventory Search

Sponsor

Back
Top