Jump to content


Photo

This is odd!? Why does one script work and the other not?


  • Please log in to reply
3 replies to this topic

#1 bobleny

bobleny
  • Members
  • PipPipPip
  • Advanced Member
  • 429 posts

Posted 04 July 2006 - 05:15 AM

Yeah, I'm rescripting my site and the first way it doesn't work in IE:
http://www.firemelt....cript/index.php
<html>
	<body>
		<table class="main" border="1" cellpadding="0" cellspacing="0" cols="2" rows="3">
			<tr>
				<td colspan="2">
					<img src="nav_top_bann.png" alt="Banner" />
				</td>
			</tr>
			
			<tr>
				<td colspan="2">
					<img src="nav_time.png" alt="Todays Date" />
				</td>
			</tr>
			
			<tr>
				<td width="192">
					Nave
				</td>
				<td>
					Lots of Text
				</td>
			</tr>
		</table>
	</body>
</html>

But this code does!???:
http://www.firemelt....ipt/index_3.php
<html>
	<body>
		<table class="main" border="1" cellpadding="0" cellspacing="0" cols="2" rows="3">
			<tr>
				<td colspan="2"><img src="nav_top_bann.png" alt="Banner" /></td>
			</tr>
			
			<tr>
				<td colspan="2"><img src="nav_time.png" alt="Todays Date" /></td>
			</tr>
			
			<tr>
				<td width="192">Nave</td>
				<td>Lots of Text</td>
			</tr>
		</table>
	</body>
</html>

I have 2 questions:
1.) Why doesn't the top one work? HTML ignores extra white sace. I am of course refering to the space underneath the images even though the cellpadding is set to "0".
2.) In both versions of the script, in IE, the td tag with the width does not work. Insted of makeing that cell 193px wide it makes it 192px short! Why is this?

Both of course work as they should in FF
-- www.firemelt.net --
First do me a favor and read this: JavaScript is NOT Java - Then read this: www.php.net - When your done with that, read this Topic
After that, floors open. I and anyone else will be MORE than happy to answer YOUR query! [Topic Solved]
Cheer up, the worst has yet to come...

#2 wildteen88

wildteen88
  • Staff Alumni
  • Advanced Member
  • 10,482 posts
  • LocationUK, Bournemouth

Posted 04 July 2006 - 10:13 AM

Sometimes some browser dont ignore the wide space between or within table cells. It usually corrected by removing the white space from within and around the td tags.

Also about the width. The width of an element is calculated by adding the total border and padding sizes to the the current width of an element, such as a table cell. So for example you have a border for your table set to 1px and have set a width of 192px for one of your table cells. The browser will give the cell a total of 194px. Here its added more 2px to the total width, why? Because on each side, the left and the right, of the element will have a border of 1px so it adds those two sides up together to get the total border width.

You might want to read up on the box model. Heres an Interactive demo of the box model.

#3 bobleny

bobleny
  • Members
  • PipPipPip
  • Advanced Member
  • 429 posts

Posted 04 July 2006 - 08:08 PM

I know that its 2pxs more because of my border. My problem is that even though it should only be 194pxs wide, it's not. Its actually a lot more. If you could take a look in IE you will notic that the cell (bottom left) is far greater then 200px! Thats what I can't figuer out. It seems as though the bottom right cell is the one that is being set to 192px, which of course is incorrect and shouldnt be doning that.
http://www.firemelt....ipt/index_3.php
-- www.firemelt.net --
First do me a favor and read this: JavaScript is NOT Java - Then read this: www.php.net - When your done with that, read this Topic
After that, floors open. I and anyone else will be MORE than happy to answer YOUR query! [Topic Solved]
Cheer up, the worst has yet to come...

#4 nogray

nogray
  • Members
  • PipPipPip
  • Advanced Member
  • 930 posts
  • LocationSan Francisco CA

Posted 05 July 2006 - 04:09 PM

IE does ignore Extra Spaces (that's extra) if you have a line break after the image, that will be considered a space. You can use a line break (<br />) after the image or just close the td

If you want to width to work (using width="##") you gotta set the table width and the other cell width as well. Otherwise you can use css which works better.

NoGray.com





0 user(s) are reading this topic

0 members, 0 guests, 0 anonymous users