image alignment-- extra white space
Moderator: General Moderators
image alignment-- extra white space
i need some help removing extra white space.
right now the profiles have data that's held in place by a table (iframes used to call another page for some of the data)
it's adding extra white space around the pictures for some reason. i haven't been able to figure it out. i use css to remove cell padding and spacing. i am testing on mozilla 1.5.1 now, but in both 1.5.1 and 1.3.1 the space would come and go, and in ie 6.0 it's always there.
you can see it here: http://24.91.157.113/findyourdesire/profile.php?un=neo
if anyone has any ideas why, i'd appreciate hearing them. and since i am new to css, if you feel i shouldn't be using a table nested there to hold the pictures, then i'd be interested in chatting on aim or icq to go over switching to css with you.
-Josh
right now the profiles have data that's held in place by a table (iframes used to call another page for some of the data)
it's adding extra white space around the pictures for some reason. i haven't been able to figure it out. i use css to remove cell padding and spacing. i am testing on mozilla 1.5.1 now, but in both 1.5.1 and 1.3.1 the space would come and go, and in ie 6.0 it's always there.
you can see it here: http://24.91.157.113/findyourdesire/profile.php?un=neo
if anyone has any ideas why, i'd appreciate hearing them. and since i am new to css, if you feel i shouldn't be using a table nested there to hold the pictures, then i'd be interested in chatting on aim or icq to go over switching to css with you.
-Josh
-
microthick
- Forum Regular
- Posts: 543
- Joined: Wed Sep 24, 2003 2:15 pm
- Location: Vancouver, BC
correct....
it should somewhat look like this
it should somewhat look like this
Code: Select all
<table>
<tr>
<td><img src="boo.gif"></td>
<tr>
</table>- Derfel Cadarn
- Forum Contributor
- Posts: 193
- Joined: Thu Jul 17, 2003 12:02 pm
- Location: Berlin, Germany
I've been struggling with a similar problem. The testsite at http://www.birgitgolms.com/20031222/index.html shows up correct in Mozilla 1.4, Opera 6.0 and even in Konqueror. But Netscape 6.2.2 places a whitespace between the table-cells.
I've tried the solution you've mentioned above (on my own PC, not yet online), but the result is still the same.
Any ideas?? Please???
I've tried the solution you've mentioned above (on my own PC, not yet online), but the result is still the same.
Any ideas?? Please???
-
microthick
- Forum Regular
- Posts: 543
- Joined: Wed Sep 24, 2003 2:15 pm
- Location: Vancouver, BC
I remember having problems with NS6.2 on the last large site I developed. Basically, my menu was contained within a three column table. The first and third columns were images and the middle column was text with a background image. NS6.2 had severe problems removing white space. But by removing the DOCTYPE from the top of the page, the problems were fixed. Of course, this is a bad way of fixing the problem, so I blamed it on the browser itself. Netscape 7 didn't have this same problem.
ok. i had no white space in the cells. but that wasn't working. i removed it from the rows and it looked different.. then i removed whitespace from the entire image section so it's all one line.
now it displays right in ie but has white space in mozilla (1.5.1)
here's the new code below. any help is GREATLY appreciated. formerly i had a return carriage and "pretty printing" white space after each <tr> and </tr> and </td> but no other spaces.
relevant section of code (row in the outer table that has the images)
now it displays right in ie but has white space in mozilla (1.5.1)
here's the new code below. any help is GREATLY appreciated. formerly i had a return carriage and "pretty printing" white space after each <tr> and </tr> and </td> but no other spaces.
relevant section of code (row in the outer table that has the images)
Code: Select all
<!-- table for pics and options -->
<td>
<table cellspacing="0" class="regw100">
<tr><td colspan="2" rowspan="2"><a name="#main" href="#main" onclick="window.open('pic.php?pic=main.neo.jpg&fn=full', 'pic', 'height=259,width=236');"><img alt="main pic" src="pic.php?pic=main.neo.jpg&fn=main" title="Neo's main picture" /></a></td><td><a name="#t1" href="#t1" onclick="window.open('pic.php?pic=t1.neo.jpg&fn=full', 'pic', 'height=392,width=470');"><img alt="thumb 1" src="pic.php?pic=t1.neo.jpg&fn=thumb" title="thumb 1" /></a></td></tr><tr><td><a name="#t2" href="#t2" onclick="window.open('pic.php?pic=t2.neo.jpg&fn=full', 'pic', 'height=320,width=372');"><img alt="thumb 2" src="pic.php?pic=t2.neo.jpg&fn=thumb" title="thumb 2" /></a></td></tr><tr><td><img alt="no picture to display" src="pic.php?pic=&fn=thumb" title="no picture to display" /></td><td><img alt="no picture to display" src="pic.php?pic=&fn=thumb" title="no picture to display" /></td><td><a name="#salute" href="#salute" onclick="window.open('pic.php?pic=slaute.neo.jpg&fn=full', 'pic', 'height=272,width=340');"><img alt="Neo's salute" src="pic.php?pic=salute.neo.jpg&fn=thumb" title="Neo's salute" /></a></td></tr>
<tr>
<td colspan="3" class="profilegoodies">
<ol>
<li>View or Make <a name ="#comments"href="#comments" onclick="window.open('comments.php?un=Neo&uid=1', 'comments', 'height=250,width=500,scrollbars=yes');">Comments</a></li>
<li>View my <a name="#lust" href="#lust" onclick="window.open('desire.php?un=Neo&uid=1&fn=lust', 'lustlist', 'height=200,width=482,scrollbars=yes');">Lustation List</a></li>
<li>Add this member to your <a name="#desire" href="#desire" onclick="window.open('adddesire.php?fun=Neo&fuin=1', 'desire', 'height=196,width=288,scrollbars=yes');">Desires</a></li>
<li>View my <a href="blog.php?buid=1&mtd=Neo">Journal</a></li>
<li>Link Directly to this profile: http://www.FindYourDesire.com/findyourdesire/profile.php?un=Neo</li>
</ol>
</td>
</tr>
</table>
</td>
</tr>You're missing cellpadding from your <table> tag...
Code: Select all
<table cellpadding="0" cellspacing="0">
<tr>
<td><img src="image.gif" alt="" /></td>
</tr>
</table>- Derfel Cadarn
- Forum Contributor
- Posts: 193
- Joined: Thu Jul 17, 2003 12:02 pm
- Location: Berlin, Germany
Well, I just tried removing the DOC-type: no effect in NS6.2.
I checked the TABLE-tag: it had both cellpadding="0" and cellspacing="0" in it...still a mess in NS 6.2
Just now I noticed a site, where they used: instead of the code I used:
Can anyone tell me which one is the correct one? Not that it makes much difference, I tried both of them and it didn't make any difference in NS6.2..Haven't tried other browsers though.
Perhaps I should just let it be...
Could anyone tell me how it looks in NS7, please? Microthick, please? I don't have it installed (yet)...waiting for my new HD.
I checked the TABLE-tag: it had both cellpadding="0" and cellspacing="0" in it...still a mess in NS 6.2
Just now I noticed a site, where they used:
Code: Select all
<frameset framespacing="0" border="false" frameborder="0" cols="155,*">Code: Select all
<frameset cols="245,*" FRAMEBORDER="0" BORDER="no" framespacing="0">Perhaps I should just let it be...
Could anyone tell me how it looks in NS7, please? Microthick, please? I don't have it installed (yet)...waiting for my new HD.
-
microthick
- Forum Regular
- Posts: 543
- Joined: Wed Sep 24, 2003 2:15 pm
- Location: Vancouver, BC
Check your pm. We've hijacked this thread too much already.Derfel Cadarn wrote:Well, I just tried removing the DOC-type: no effect in NS6.2.
I checked the TABLE-tag: it had both cellpadding="0" and cellspacing="0" in it...still a mess in NS 6.2
Just now I noticed a site, where they used:instead of the code I used:Code: Select all
<frameset framespacing="0" border="false" frameborder="0" cols="155,*">Can anyone tell me which one is the correct one? Not that it makes much difference, I tried both of them and it didn't make any difference in NS6.2..Haven't tried other browsers though.Code: Select all
<frameset cols="245,*" FRAMEBORDER="0" BORDER="no" framespacing="0">
Perhaps I should just let it be...
Could anyone tell me how it looks in NS7, please? Microthick, please? I don't have it installed (yet)...waiting for my new HD.
micro: it's all realated so i don't think it's hi-jacking.
genik: i use css to remove cell spacing (i thought) but i guess it's not working in all browsers. i have "padding:0;" as part of all table classes, and if inheritence doesn't work, i still have a td{} in there and "padding:0;" is in that. since adding the padding didn't quite work i think it's an ie compensating for something, so i'm going to check something. i think it has to do with the classes used....and i'm right.. it's the classes and the fact for some reason the sizes of the pics aren't as large as i expected, or the cells are larger.
Derfel Cadarn: according tothe refrences i can find, yes/no is nescape 4 and under only. 1 and 0 is the w3c standard. and since XHTML is case sensitive and everything needs to be lowerrcase, if you haven't already, i suggest making your code lower case.
genik: i use css to remove cell spacing (i thought) but i guess it's not working in all browsers. i have "padding:0;" as part of all table classes, and if inheritence doesn't work, i still have a td{} in there and "padding:0;" is in that. since adding the padding didn't quite work i think it's an ie compensating for something, so i'm going to check something. i think it has to do with the classes used....and i'm right.. it's the classes and the fact for some reason the sizes of the pics aren't as large as i expected, or the cells are larger.
Derfel Cadarn: according tothe refrences i can find, yes/no is nescape 4 and under only. 1 and 0 is the w3c standard. and since XHTML is case sensitive and everything needs to be lowerrcase, if you haven't already, i suggest making your code lower case.
ok. i think i see the issue.. i just don'tknow why it's occuring. the issue deals with the image sizes.
the table is 750 pixels in width. the frame ont he side of the pictures isn 375 pixels in width. the small pictures are 125 by 125 and the large one is 250 by 250. this means the pictures should be a 375 by 375 block.
this occurs right in explorer but not in mozilla.
does anyone have any idea why?
i checked the inner table is to take up 100% of the width it has available, but the outer table is only 750 pixels in width and the cell to the left of the icell containing the inner table is 375 (375+375==750?)
the table is 750 pixels in width. the frame ont he side of the pictures isn 375 pixels in width. the small pictures are 125 by 125 and the large one is 250 by 250. this means the pictures should be a 375 by 375 block.
this occurs right in explorer but not in mozilla.
does anyone have any idea why?
i checked the inner table is to take up 100% of the width it has available, but the outer table is only 750 pixels in width and the cell to the left of the icell containing the inner table is 375 (375+375==750?)
-
microthick
- Forum Regular
- Posts: 543
- Joined: Wed Sep 24, 2003 2:15 pm
- Location: Vancouver, BC