Right,

Designed a website in Photoshop for the first time and have sliced it, saved it as html and images and opened it in Dreamweaver.
When i try to add a link to one of the image slices with a simple bit of html

<a href="index.html">

it makes the rest of the images around it move and then there are white gaps in the layout.

This is what i mean,

[IMG]http://img31.picoodle.com/img/img31/4/5/26/f_example1m_acea983.jpg[/IMG]

I didn't put that blue box around home either by the way.
Any ideas on how to make it not do that?

Thanks in advance

Will

Recommended Answers

All 13 Replies

Member Avatar for GreenDay2001

Could you post link to the page or a bit of with which you have problem so that we could help better.

Well you may try this. Use following CSS properties and see if it works.

{
  border-width: 0px;
  display: block;
}
Member Avatar for GreenDay2001

> I have never done this before so i dont know what to do with that css Syntax

Well, its simple. Just add following lines anywhere between the <head></head> tags.

<style type="text/css">
  <!--
	#Table_01 img {
		border-width: 0px;
		display: block;
	}
  -->i
</style>

And your page uses some non standard things like leftmargin, topmargin, marginwidth, marginheight . For setting margin at 0 from every side, add this attribute style="margin: 0;" to body tag. So it will look like this:

<body bgcolor="#FFFFFF" style="margin: 0;">

You also haven't put up a doctype. I encourage you to validate your web page at http://validator.w3.org/ and find other errors.

[IMG]http://img31.picoodle.com/img/img31/4/5/26/f_example1m_acea983.jpg[/IMG]

Kindly please use daniweb facilities for attacments as images placed on external servers may get removed over time. To attach image you either have to be creating new post or be in Advance options for thread reply (Go Advanced). Bellow thread text area the are Aditional Options and one of them is Manage Attacments. By clicking on the button you open new window in pop-up and you can then add certain type of documents to your post

Erm, that didn't get rid of the problem with the layout having big gaps when i try to get the home image to open a url. Once i sort out that problem i will probably be able to figure the rest out but i have tried for days to sort this..

Member Avatar for GreenDay2001

> that didn't get rid of the problem with the layout having big gaps

Have you followed instructions exactly as what I said, cause my solution works well with Firefox2, Opera9, and IE7. Try again, and submit te changed webpage so that I could look into.

OMG! It worked this time i went through your instructions again and it worked! Cracking!

One more question though please :D

How do i make the site fit to all resolution screens because i made it fit mine but its a 24 inch screen so i checked on my friends and it isn't centered and stuff so wondering if that was possible?

Thanks!!

Member Avatar for GreenDay2001

> How do i make the site fit to all resolution screens

It wont fit in all resolutions because, you have specified absolute dimensions to every image and table, the everything is constant. Also if you use relative sizing i.e. percentage, it will deteriorate image quality. You must rather use images for background which are able to repeat itself and give complete effect without looking awkward.

So how would i make a website that isn't absolute dimension?! That is the only way that i found to make a site that looks any good.

Member Avatar for GreenDay2001

> how would i make a website that isn't absolute dimension?

For this I would say learn and practice. You will know yourself. Learn HTML/xHTML, CSS(if you want then JavaScript too), practice them and you'll be able to create a decent site easily. Familiarise yourself with some graphic design techniques for making background, buttons etc.

> That is the only way that i found to make a site that looks any good.
Perhaps this site i.e. www.daniweb.com is good example to prove that isn't the only way.

Hi,
absolute dimensions and making a Website completly as a graphic does cause many problems ( such as editing the site, how it looks on each monitor) There is a code I can post that can make a site show up the same in almost every single resolution. I have not personally tested the code but I have viewed a site that has and they are awesome!

Oh that would be awesome if you could!

Oh that would be awesome if you could!

Okay, I am graduating today so I will dig through my Web designer magazines a little later to find the correct code.

Be a part of the DaniWeb community

We're a friendly, industry-focused community of developers, IT pros, digital marketers, and technology enthusiasts meeting, networking, learning, and sharing knowledge.