[YamaDan]

Hi,

I added a thread a few days ago asking to view my site and hopefully get some help..
But I think the way I added it with a link to my test site made people think it was dodgy or had a worm? or ??
Am I best to copy & paste the actual code on here?

Thanks Dan.

[snowyswebsolutions]

YamaDan, on Jun 20 2009, 17:54, said:

Hi,

I added a thread a few days ago asking to view my site and hopefully get some help..
But I think the way I added it with a link to my test site made people think it was dodgy or had a worm? or ??
Am I best to copy & paste the actual code on here?

Thanks Dan.

just put the address any old way and ill take a look.

[YamaDan]

snowyswebsolutions, on Jun 20 2009, 19:39, said:

just put the address any old way and ill take a look.

Cheers,
The problem is In IE6 on the roll over images, the borders don't change color all the way down.
And the bottom image is in a lower position than if viewed in FF. Margin or padding problem?
This is a tutorial I have modified a bit while learning.

My test site is at http://www.danstestsite.talktalk.net
CSS is at http://www.danstests...net/osteoDT.css


I'm finding browser checking a right pain...

Any advice much appreciated

[snowyswebsolutions]

YamaDan, on Jun 20 2009, 23:00, said:

Cheers,
The problem is In IE6 on the roll over images, the borders don't change color all the way down.
And the bottom image is in a lower position than if viewed in FF. Margin or padding problem?
This is a tutorial I have modified a bit while learning.

My test site is at http://www.danstestsite.talktalk.net
CSS is at http://www.danstests...net/osteoDT.css


I'm finding browser checking a right pain...

Any advice much appreciated

I will look into the problem but i will comment on your site. Have you created this from scratch? due to i do like the heading/background alot. My input would be if your good with the old photoshop, i think this is the perfect layout and style for 3 nice image sub headings. i.e. Practitioner, Treated Conditions and Common Treatments in that yellow gives it that noob factor but i do like.

[YamaDan]

snowyswebsolutions, on Jun 20 2009, 23:14, said:

I will look into the problem but i will comment on your site. Have you created this from scratch? due to i do like the heading/background alot. My input would be if your good with the old photoshop, i think this is the perfect layout and style for 3 nice image sub headings. i.e. Practitioner, Treated Conditions and Common Treatments in that yellow gives it that noob factor but i do like.

cheers,
I can' t take credit for the design, I followed an online tuturial.
Is noob bad?

[snowyswebsolutions]

YamaDan, on Jun 20 2009, 23:27, said:

cheers,
I can' t take credit for the design, I followed an online tuturial.
Is noob bad?

ermmm... depends on how you look at it, try a different font, maybe also test out some colours you wouldn't expect to use.

[Paul Millar]

by "noob factor" snowy means it is apparent someone who is new to web design has done it...
Hope that helped, but yeah - try playing around a bit

[YamaDan]

Oh Yeah noob thats me alright.
I am trying various designs out.
And will try fancy image sub headers, (thanks for tip)

But can you guys help with the IE6 problem?

How do you get a design to work in all browsers?

[Wickham]

YamaDan, on Jun 21 2009, 20:52, said:

But can you guys help with the IE6 problem?

How do you get a design to work in all browsers?

You should be able to get a page looking and working the same in Firefox, Opera and Safari as they are very similar; always code for these first.

You will still find that browsers have different default margins or padding on some tags like p ul ol li input and a few others so always set margings and padding yourself to overide the default settings.

IE and especially IE6 will often display differently and need different styles, so it often means that you have to add one or more conditional comments that only apply to IE or selected versions of IE. So design for Firefox, etc. first, then look at IE7 (which may not need much separate coding, if any) then check IE6. IE8 is fairly similar to Firefox but still has the different default margins and padding.

Add a conditonal comment(s) as described here:-
http://www.javascrip...howto/cc2.shtml
they must be put in the head section of every page AFTER any main stylesheet links so that the browser processes them second, but remember that any inline styles in the html markup will overide styles in stylesheets and conditional comments.

[ReaperWD]

Just a quick one to add to Wickhams comments:

Have you tried adding a style reset sheet? i find these are great to work from (even if some people view the practice as abit old) as it basically resets the majority of the browser settings, giving you a blanker canvas to work from.

Reaper

[YamaDan]

Cheers guys,

Wickham, I have seen these <!---IE> but just thought it was a comment.
Time to try them out, thanks for link.

Reaper, Resets I have seen them but do I leave it all as is or change some?
eg. this one http://meyerweb.com/...ools/css/reset/

[snowyswebsolutions]

YamaDan, on Jun 22 2009, 22:04, said:

Cheers guys,

Wickham, I have seen these <!---IE> but just thought it was a comment.
Time to try them out, thanks for link.

Reaper, Resets I have seen them but do I leave it all as is or change some?
eg. this one http://meyerweb.com/...ools/css/reset/

* {
	margin: 0;
	padding: 0;
	border: 0;
	outline: 0;
	font-size: 100%;
	vertical-align: baseline;
	background: transparent;
}
body {
	line-height: 1;
}
ol, ul {
	list-style: none;
}
blockquote, q {
	quotes: none;
}
blockquote:before, blockquote:after,
q:before, q:after {
	content: '';
	content: none;
}

/* remember to define focus styles! */
:focus {
	outline: 0;
}

/* remember to highlight inserts somehow! */
ins {
	text-decoration: none;
}
del {
	text-decoration: line-through;
}

/* tables still need 'cellspacing="0"' in the markup */
table {
	border-collapse: collapse;
	border-spacing: 0;
}

Just having mi 2pence worth

[YamaDan]

I'll try that 1st. So I can take out most of meyers beginning bit. Cheers Snowy.

[YamaDan]

Hours later....this fixed it

<!--[if IE]>
<style type="text/css">
dl.pics dt a:hover, dl.pics dd a:hover { border:2px; }
dl.pics a:hover img {
border:2px;
}
</style>
<![endif]-->

"making border 2px again"

Also played with resets & margins to sort position.


Thanks all.