logo-dw

Go Back   Dreamweaver Club Forums > Hand Coders Forum > HTML and CSS
Register FAQ Members List Search Today's Posts Mark Forums Read

Reply
 
Thread Tools Display Modes
Old 11-19-2012, 03:04 PM   #1
bdcee
 
Join Date: Nov 2012
Posts: 2
Question Space around images or cells?

Hi all, I'm new the forums and it looks like this is the place to get help from some experts so Here we go. Thanks in advance to anyone who can offer some help!!

I've created a simple page as a sample to try my best to give you a good example to look at. I know this is something so simple that I am just missing somehow, but for the life of me I can't solve this issue I'm having.

On the page, I basically have a table (with no border), 4 rows, 2 column layout. Each cell has one image inside it, and when viewed as a webpage, all of the images should match up or touch with no space between them (naturally). I've attached some screencaps as well to show the space I'm referring to, and I've also included the code so someone can remind me of my ignorance haha.

PLEASE HELP!!

screen caps:
http://screencast.com/t/DYQtEtBwN (expanded tables mode to show the space better)
http://screencast.com/t/q0BugMvtRlu8 (standard tables mode)
http://screencast.com/t/7IksWRWs1 (the page viewed in a browser)

HTML of the page:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title>Sample Page</title>

</head>

<body leftmargin="0" topmargin="0" marginwidth="0" marginheight="0">
<div align="center">
<table width="1000" border="0">
<tr>
<td colspan="2"><img src="images/header.jpg" width="1000" height="346"/><br /></td>
</tr>
<tr>
<td colspan="2"><img src="images/oom_link01.jpg" width="1000" height="51" /></td>
</tr>
<tr>
<td colspan="2"><img src="images/grd01.jpg" width="1000" height="26" /></td>
</tr>
<tr>
<td width="263"><img src="images/img_left.jpg" width="263" height="378" /></td>
<td width="733"></td>
</tr>
</table>
</div>
</body>
</html>
bdcee is offline   Reply With Quote
Old 11-19-2012, 07:19 PM   #2
domedia
Administrator
domedia's Avatar
 
Join Date: Dec 2003
Posts: 9,730
Default

Hi bdcee! I think most of the people on this forum is going to say that you have to change your approach. Thank god it's only a sample page, so you have not gotten too far into it

Use a regular CSS based layout and and take it from there. Do you have a mockup of your design? I'm sure someone can help you out with how to lay the foundation of your web site down in a standard manner.

Tables have default padding and margins that you can look at getting rid of if you insist on hacking a table to do your table layout. Try setting all the margin and padding to 0 for tables and table headers/cells.
domedia is offline   Reply With Quote
Old 11-20-2012, 04:35 PM   #3
bdcee
 
Join Date: Nov 2012
Posts: 2
Default

Thank you very much for the info domedia! I've been using Dreamweaver for a year or so, and I still have a TON to learn. I don't know alot about CSS but I'm learning a little the more I poke around, as well as from getting help from good folks like yourself. For this page I was referring to, it's only a sample page with a few columns and rows, so I just highlighted all the cells and set the padding and spacing to 0 and it worked perfectly! You'd think since they were never set to anything originally (those areas in the properties were both blank), this would've had no padding or spacing, but nope! So anyway just wanted to say thank you for your help! Have a good one!
bdcee is offline   Reply With Quote
Old 11-21-2012, 12:23 PM   #4
Corrosive
Corrosive's Avatar
 
Join Date: Feb 2008
Location: Bristol, England
Posts: 7,103
Default

Quote:
Originally Posted by bdcee View Post
You'd think since they were never set to anything originally (those areas in the properties were both blank), this would've had no padding or spacing, but nope! So anyway just wanted to say thank you for your help! Have a good one!
Some HTML tags have browser defaults (things like margin and padding, font sizes etc.) If you are feeling brave then you could start with a reset CSS; http://meyerweb.com/eric/tools/css/reset/ which will get rid of all the defaults so you start with a blank canvas (so to speak).
Corrosive is offline   Reply With Quote
Reply


Thread Tools
Display Modes

Posting Rules
You may not post new threads
You may not post replies
You may not post attachments
You may not edit your posts

BB code is On
Smilies are On
[IMG] code is On
HTML code is Off

Forum Jump


All times are GMT. The time now is 12:10 AM.


Powered by vBulletin® Version 3.8.7
Copyright ©2000 - 2017, vBulletin Solutions, Inc.
Copyright 2006 DreamweaverClub.com