Any web designers here? at DVinfo.net

John Stakes · March 21st, 2009, 10:21 PM

Ok so I get about two clients a year for a website design (literally about two per year!). I don't advertise it but somehow they find out...weird huh?

Anyhow I have a simple question. If you click this link

All In It Entertainment

you will see the homepage image. I split the image into 3 separate files, and the second image (reading "enter site") is a link. There is a small space between each image. How do I get rid of these spaces?
Thanks

JS

Craig Yates · March 22nd, 2009, 08:23 AM

Admittedly I'm a bit out of practice, but after having a look I couldn't seem to figure out how to sort it. Still, I'd recommend that you ditch the tables anyway and move to solely using DIVs in combination with CSS. You'll probably run into fewer hassles in the long run, and using tables for layout is an archaic technique as far as I'm concerned.

Andrew Smith · March 22nd, 2009, 10:08 AM

I've viewed it in both MSIE and Chrome and I can't see any gaps between the images.

Andrew

John Stakes · March 23rd, 2009, 12:21 PM

Craig,

You are right. Tables is the old school way of doing things and CSS is much more versatile. However when I use CSS I always run into problems with positioning showing up different in multiple browsers. The ultimate solution is for me to just figure out the CSS and do it right. I think that's what I will do.

Andrew,

With the background the same color, the only noticeable gap is a horizontal line above the 'Enter' button. Do you see it?

JS

Andrew Smith · April 4th, 2009, 04:57 AM

John,

The only browser I can see the horizontal line in is Firefox. In MSIE 6.0 (yeah, I know) there is a blue box around the hyperlinked area. Possibly a rogue issue with the border width specification on a linked image.

Looking in to your code, you don't have it specified as to what width the border line is, which would then leave it up to the browser's default setting as to how this is then handled. BTW, that blue colour is also a browser default for hyperlinks.

I would suggest specifying a border width of zero so that *definitely* no border is applied by a browser.

Your code snippet should be updated from:

<img src="images/splash_02.gif" alt="<click to enter>" width="500" height="37">

to:

<img src="images/splash_02.gif" alt="<click to enter>" width="500" height="37" border="0">

Andrew

John Stakes · June 13th, 2009, 10:42 AM

I know this is an old thread, but just wanted to update and say thanks for the help. BTW Andrew you were right, it was the border!

Thanks again,

JS

Andrew Smith · June 30th, 2009, 09:38 PM

Much appreciated for the update. Thanks.

Andrew

Matthew Overstreet · August 7th, 2009, 10:31 AM

Forget about tables being "dead" ... I think they're fine if that's what you want to use ...

More of an issue is ... using a splash page altogether ... does the client really want to use one? Hopefully they understand that they are more of an annoyance for users and ... not the best option if they want to rank well in the engines.

Greg Donovan · August 11th, 2009, 08:47 PM

Old thread, but I have to agree with Matthew, though for that particular instance (assuming the splash page is neccessary) it would have probably been easier to use a basic image map.

Greg

March 21st, 2009, 10:21 PM	#1
John Stakes Major Player Join Date: Jan 2008 Location: Orlando, FL Posts: 558	Any web designers here? Ok so I get about two clients a year for a website design (literally about two per year!). I don't advertise it but somehow they find out...weird huh? Anyhow I have a simple question. If you click this link All In It Entertainment you will see the homepage image. I split the image into 3 separate files, and the second image (reading "enter site") is a link. There is a small space between each image. How do I get rid of these spaces? Thanks JS

August 7th, 2009, 10:31 AM	#8
Matthew Overstreet Regular Crew Join Date: Dec 2004 Location: Whitman, Massachusetts Posts: 168	Forget about tables being "dead" ... I think they're fine if that's what you want to use ... More of an issue is ... using a splash page altogether ... does the client really want to use one? Hopefully they understand that they are more of an annoyance for users and ... not the best option if they want to rank well in the engines. __________________ Late December. A feature film by Matthew Overstreet & Christopher J. Adams.

March 22nd, 2009, 08:23 AM	#2
Craig Yates New Boot Join Date: Mar 2009 Location: Northampton, UK Posts: 24	Admittedly I'm a bit out of practice, but after having a look I couldn't seem to figure out how to sort it. Still, I'd recommend that you ditch the tables anyway and move to solely using DIVs in combination with CSS. You'll probably run into fewer hassles in the long run, and using tables for layout is an archaic technique as far as I'm concerned.

March 22nd, 2009, 10:08 AM	#3
Andrew Smith Equal Opportunity Offender Join Date: Feb 2009 Location: Brisbane, Australia Posts: 3,016	I've viewed it in both MSIE and Chrome and I can't see any gaps between the images. Andrew

March 23rd, 2009, 12:21 PM	#4
John Stakes Major Player Join Date: Jan 2008 Location: Orlando, FL Posts: 558	Craig, You are right. Tables is the old school way of doing things and CSS is much more versatile. However when I use CSS I always run into problems with positioning showing up different in multiple browsers. The ultimate solution is for me to just figure out the CSS and do it right. I think that's what I will do. Andrew, With the background the same color, the only noticeable gap is a horizontal line above the 'Enter' button. Do you see it? JS

April 4th, 2009, 04:57 AM	#5
Andrew Smith Equal Opportunity Offender Join Date: Feb 2009 Location: Brisbane, Australia Posts: 3,016	John, The only browser I can see the horizontal line in is Firefox. In MSIE 6.0 (yeah, I know) there is a blue box around the hyperlinked area. Possibly a rogue issue with the border width specification on a linked image. Looking in to your code, you don't have it specified as to what width the border line is, which would then leave it up to the browser's default setting as to how this is then handled. BTW, that blue colour is also a browser default for hyperlinks. I would suggest specifying a border width of zero so that definitely no border is applied by a browser. Your code snippet should be updated from: <img src="images/splash_02.gif" alt="<click to enter>" width="500" height="37"> to: <img src="images/splash_02.gif" alt="<click to enter>" width="500" height="37" border="0"> Andrew

June 13th, 2009, 10:42 AM	#6
John Stakes Major Player Join Date: Jan 2008 Location: Orlando, FL Posts: 558	I know this is an old thread, but just wanted to update and say thanks for the help. BTW Andrew you were right, it was the border! Thanks again, JS

June 30th, 2009, 09:38 PM	#7
Andrew Smith Equal Opportunity Offender Join Date: Feb 2009 Location: Brisbane, Australia Posts: 3,016	Much appreciated for the update. Thanks. Andrew

August 11th, 2009, 08:47 PM	#9
Greg Donovan Regular Crew Join Date: May 2009 Location: Sydney, NS, Canada Posts: 53	Old thread, but I have to agree with Matthew, though for that particular instance (assuming the splash page is neccessary) it would have probably been easier to use a basic image map. Greg