| Author |
 Topic  |
|
|
Da_Stimulator
DEV Team Forum Moderator
USA
3373 Posts |
 Posted - 18 November 2004 : 14:45:53
|
Question is regarding tables n images...
In IE my page displays perfectly fine, however in firefox, it shows a gap about 4 pixels in between every single image. SO, my left nav menu looks like crap. I tried removing white space, that didnt do a thing. That was the only thing I thought that caused that...
table format is like so:
<table border="0" width="100%" cellspacing="0" cellpadding="0" dir="ltr" height="100%" align="left">
<tr>
<td valign="top" background="images/sideimg.gif" width="140">
<img border="0" src="images/side1.gif" width="140" height="62" alt="side1.gif" /><br />
<img border="0" src="images/nav_home.gif" width="140" height="25" alt="Home/News" /><br />
<img border="0" src="images/nav_forums.gif" width="140" height="25" alt="Forums" /><br />
<img border="0" src="images/nav_stories.gif" width="140" height="25" alt="Stories" /><br />
<img border="0" src="images/nav_jokes.gif" width="140" height="25" alt="Jokes" /><br />
<img border="0" src="images/nav_downloads.gif" width="140" height="25" alt="Downloads" /><br />
<img border="0" src="images/nav_gallery.gif" width="140" height="25" alt="Picture Gallery" /><br />
<img border="0" src="images/nav_etc.gif" width="140" height="25" alt="Other Shit" /><br />
<img border="0" src="images/botimg.gif" width="140" height="64" alt="botimg.gif" /></td>
<td valign="top" align="left">
body stuff which displays just fine
</td></tr></table>
[there is no line break between the images, I did that here for readability]
In between every single image in the nav, is a WHITE space (its not even the background image)....
Firefox is a new challenge for me. I dont want to post a link... for reasons I'd rather not say. If its nec. to see a link to know what I'm talking about, IM me on yahoo (da_stimulator2002) or msn (da_stimulator[at]hotmail.com)
BTW, the doctype is set to the following, wouldnt have anything to do with it???
<!DOCTYPE HTML PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" dir="ltr" lang="en-us">
[edit]
I just tried nesting a table with exact parameters (height=301 width=140) and exact parameters per table cell, no border, no cellspacing, no cellpadding in table tag, and I still get the stupid space... |
-Stim |
Edited by - Da_Stimulator on 18 November 2004 15:23:24 |
|
|
HuwR
Forum Admin
United Kingdom
20584 Posts |
Posted - 18 November 2004 : 16:20:40
|
make sure you set hspace and vspace to 0.
IE defaults them to 0 Firefoxe defaults them to 2  |
 |
|
|
Da_Stimulator
DEV Team Forum Moderator
USA
3373 Posts |
Posted - 18 November 2004 : 16:25:43
|
My syntax checker shows hspace/vspace as invalid properties for table, and dosnt show them at all for td...
anyhow, I tried that in both the table tags and td tags, ending up with the stupid white space anyway |
-Stim |
|
|
|
laser
Advanced Member
Australia
3859 Posts |
|
|
Da_Stimulator
DEV Team Forum Moderator
USA
3373 Posts |
Posted - 18 November 2004 : 16:31:42
|
*entitles self "moron"*
that still didnt work |
-Stim |
Edited by - Da_Stimulator on 18 November 2004 16:33:02 |
|
|
|
Roland
Advanced Member
Netherlands
9335 Posts |
Posted - 18 November 2004 : 17:29:36
|
| remove the break tags. The cell will force the images to get to the next lines so the break tags aren't necessary. |
|
|
|
Da_Stimulator
DEV Team Forum Moderator
USA
3373 Posts |
Posted - 18 November 2004 : 17:36:34
|
tried that already.... didnt work.
What I've tried
Removing ALL whitespace from the entire document
removing <br /> tags
nesting tables
hspace and vspace
Short of combining the images and making an image map (do NOT want to do), Im stumped |
-Stim |
|
|
|
RichardKinser
Snitz Forums Admin
USA
16655 Posts |
Posted - 18 November 2004 : 17:45:54
|
| I think it would be easier to fix if we could get a link to an example. Doesn't have to be the actual page you are working on, just an example would be sufficient. |
|
|
|
Da_Stimulator
DEV Team Forum Moderator
USA
3373 Posts |
Posted - 18 November 2004 : 17:56:09
|
| ... |
-Stim |
Edited by - Da_Stimulator on 18 November 2004 22:18:25 |
|
|
|
dayve
Forum Moderator
USA
5820 Posts |
Posted - 18 November 2004 : 19:37:58
|
this line is screwing it up in Firefox:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
I recoded your page and the problem goes away.
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<base href="http://www.cleanshare.org/kizzelwhix/" >
<html xmlns="http://www.w3.org/1999/xhtml" dir="ltr" lang="en-us">
<head lang="en-us" dir="ltr">
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>KizzelWhix 1.0</title>
<meta name="description" content="" />
<meta name="keywords" content="" />
<meta name="author" content="Eric Johnson" />
<meta name="copyright" content="This website and all contents copyright (c) Eric Johnson (Da_Stimulator) unless otherwise noted" />
<style type="text/css">
<!--
body {background: url(images/bg.gif) fixed #ffffff repeat 0px 0px left top; background-attachment: scroll; background-color: #ffffff; background-image: url(images/bg.gif); background-position: left top; background-repeat: repeat; color: #000000; direction: ltr; font: normal normal normal 12px normal georgia; font-family: georgia; font-size: 12px; font-stretch: normal; font-style: normal; font-variant: normal; font-weight: normal; letter-spacing: normal; line-height: normal; margin: 0px 0px 0px 0px; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding: 0px 0px 0px 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; scrollbar-arrow-color: #00cc33; scrollbar-darkshadow-color: #000000; scrollbar-face-color: #666633; scrollbar-highlight-color: #66ff00; scrollbar-shadow-color: #000033; scrollbar-track-color: #339900; text-align: left; text-decoration: none; visibility: visible}
a {color: #336633; text-decoration: none}
a:visited {color: #336633; text-decoration: none}
a:active {color: #669900; text-decoration: underline}
a:hover {color: #669900; text-decoration: underline}
img {display: table-cell}
-->
</style>
</head>
<body background="images/bg.gif" bgcolor="#ffffff" text="#000000" link="#336633" vlink="#336633" alink="#669900" leftmargin="0" marginwidth="0" topmargin="0" marginheight="0" dir="ltr">
<table border="0" width="100%" cellspacing="0" cellpadding="0" background="images/topbkg.gif" dir="ltr" height="82" >
<tr>
<td width="1%" height="82" ><img hspace="0" vspace="0" border="0" src="images/topleft.gif" width="239" height="82" alt="topleft.gif" /></td>
<td width="99%" align="right" height="82" ><img hspace="0" vspace="0" border="0" src="images/logo.gif" width="149" height="82" alt="logo.gif" /></td>
</tr>
</table>
<table border="0" width="100%" cellspacing="0" cellpadding="0" dir="ltr" align="center" >
<tr>
<td valign="top" background="images/sideimg.gif" width="140" >
<div><img hspace="0" vspace="0" border="0" src="images/nav_home.gif" width="140" height="25" alt="Home/News"></div>
<div><img hspace="0" vspace="0" border="0" src="images/nav_forums.gif" width="140" height="25" alt="Forums"></div>
<div><img hspace="0" vspace="0" border="0" src="images/nav_stories.gif" width="140" height="25" alt="Stories"></div>
<div><img hspace="0" vspace="0" border="0" src="images/nav_jokes.gif" width="140" height="25" alt="Jokes"></div>
<div><img hspace="0" vspace="0" border="0" src="images/nav_downloads.gif" width="140" height="25" alt="Downloads"></div>
<div><img hspace="0" vspace="0" border="0" src="images/nav_gallery.gif" width="140" height="25" alt="Picture Gallery"></div>
<div><img hspace="0" vspace="0" border="0" src="images/nav_etc.gif" width="140" height="25" alt="Other Shit"></div>
<div><img hspace="0" vspace="0" border="0" src="images/botimg.gif" width="140" height="64" alt="botimg.gif"></div>
</td>
<td valign="top" align="left" >
<div dir="ltr"><h3>KizzelWhix 1.0 under construction - Coming soon</h3></div>
</td>
</tr>
</table>
</body>
</html>
I removed the table cells you were using to separate the menu images as well.
http://www.hafresno.org/testing/kw.htm |
 |
Edited by - dayve on 18 November 2004 19:39:00 |
|
|
|
Da_Stimulator
DEV Team Forum Moderator
USA
3373 Posts |
Posted - 18 November 2004 : 22:21:21
|
| Why would the xhtml dtd do that?? |
-Stim |
|
|
|
dayve
Forum Moderator
USA
5820 Posts |
|
| |
Topic |
|
Topic Locked
