CSS - Hyperlink In Css Body { }

I've got my normal navigation links styled using the standard a:link, a:hover etc etc.

I want to include an image on one of my pages which links to a download, because the style applies to all 'a hrefs' the properties for my text links are assigned to the image (for instance a border is given).

Is there a way to assign a different class to the image hyperlinks?

Cheers.

On my page I have 2 different hyperlink styles, one for my menu and one for any hyperlink in the content. One is under #menu in my stylesheet and the other under #content. With FF everything looks great, but when I open my site in IE6, the hyperlink styles seem to combine. Any ideas?

I have a page that has a bunch of thumbnails on it and using css to format those images, i've added a margin to both sides for spacing. The class is applied to the href and set to have the img as a descendant. When the page renders in FF, there is no problem. But when it renders in IE, i get the nice little hyperlink underline where the margin is between two thumbnails. Any help would be great.

HTML

<a href="hometour/defiancemo/P9010045.jpg" class="thumbs" target="_blank">
<img src="hometour/defiancemo/thumbs/P9010045.jpg" alt="" />
</a>

CSS
a.thumbs img {margin: 0px 5px 10px 5px;text-decoration: none;color: #019934}

I have this website that i am using CSS for much of the styles.

I have used hotspot hyperlinks in parts of the images. Now there is the blue line that a link in html normally has around the entire div the hotspot is in. If clicked its the purple colour that a clicked (visited) hyperlink has.

The link to the page in question is
itxtme.com/still_lime/os_z_b.html

This only occurs in IE, it is not occuring in Opera. All the other links are working correctly. All source is in the webpage (view/source code)

Kind regards how i can work around this!

Scott

Can I make certain hyperlinks to be (eq) red and the others (eq) blue in one page with one css file?

okey i m just putting hyperlink on picture and i get blue boarded around it? how can i remove it?

Hi can any one suggest a solution to my problem.
I have all my a tags as -

a{border-bottom: thin #0066FF solid;text-decoration:none;padding-bottom: 2px}
and my img tag as
img {border-bottom: none}

However I have 4 images in 1 div that just wont accept it. So it must be precedence right. But theres no selector after it that would cause the issue so I've ruled that out.

So I tried a more deeper selector.

#rightside img/#rightside a img/#rightside img a/
They didn't work.

So in frustration I added a class to the 4 images a tag and then tried

.info/.info img/.info a img/.info img a/

Still no joy.

I then moved the class to the img tag in desperation and tried -
.info/img .info
Still no joy.
I tried all these with the below css -

{border-bottom: none}
{border-bottom: thin #FFF solid}
{border-bottom: 0px}
{border-bottom: transparent}
{border: none}
{border: thin #FFF solid}
{border: 0px}
{border: transparent}

I know it's not precedence because there is 1 image after these in a different p tag that takes effect.ie: no border.

It's not a selector on the same tag as there is no border on the tag.

I then drop kicked my computer across the room and decided to ask for help. Any one got any ideas?

The code looks similar to this -

<div id="new-image">
<h4><a href="my-site.htm">Link</a></h4>
<a href="my-site.htm" class="info"><img src="/images/pic.gif" alt="A picture of the picture" height="100" width="100"></a>
<h4><a href="my-site.htm">Link</a></h4>
<a href="my-site.htm" class="info"><img src="/images/pic.gif" alt="A picture of the picture" height="100" width="100"></a>
<h4><a href="my-site.htm">Link</a></h4>
<a href="my-site.htm" class="info"><img src="/images/pic.gif" alt="A picture of the picture" height="100" width="100"></a>
<h4><a href="my-site.htm">Link</a></h4>
<a href="my-site.htm" class="info"><img src="/images/pic.gif" alt="A picture of the picture" height="100" width="100"></a>
</div>

the css is -
#new-image {text-align: center;width:180px;margin:-10px 0px 13px 15px}
.info {border-bottom: none}

The a tag css is above this in the css code.

Cheers in advance

Jazajay

I have page that automatically changes the images in a container via css. Does anyone know if its possible for each image to have a different hyperlink?

Would have done this in Flash but, IT Security is not on board with that yet.

Any suggestions?

'Ello,

I have a slight problem with some CSS I am using, it works perfectly fine in other browsers but in IE 6 it doesn't. What I basically want is the body of the page to have a 10pixel margin on the left and right of the page and 0 at the top and bottom, this bit I can do. I also want everything on the page to stretch from the end of each margin (so they basically start 10 pixels in from the left and 10 pixels in from the right), which I have got working fine. Now what I am trying to do is have one div layer stretching from the very left to the very right of the page and I am getting a bit stuck on it.

What I have managed to do is set that div layer to be absolute positioning so I can use "left: 0px;" to get it all the way up against the left hand edge, but how can I get it right up against the left hand edge? I am sure if I set it to be the width of the page so for example if the page is 500 pixels wide and I use "width: 500px;" it would go from end to end, but what I want is it to go from end to end no matter what the width of the window is. For the rest of the layers that are not going from end to end but are staying within the body margins I used "width: 100%;" which works fine, but when I try it with the one that I want to go from end to end it only goes up to the body margin, but right to the end, well in IE it does anyway other browsers are fine with it. Does anyone know how to get around this? I have tried looking on the net but I can't find anything on it. All help will be greatly welcome.

Thank you in advance, El Barto.

Hi all,
I would like to be able to have the body background change when moving from page to page.
Is it possible, without javascript.

Code:

body {
    margin: 0px;
    padding: 5px 0px 5px 0px;
	background: url(blue2.jpg) fixed;
} {

Specifically the surrounding blue2.jpg that frames the page.

page link

css link

Thanks.

I am currently setting the body id of my pages to highlight what item I am on...
Such as:
body#news #news_tab a,
{
border-bottom: 1px solid #fff;
background: #fff;
color: #000;
}

But I was wondering if it was also possible to somehow make a div appear (changing display from hidden to block) by putting an id in the body tag....But since the div isn't a link, for some reason I can't make it work.

I tried:

Adding this div:
<div id="news" style="display:none">Testing Me</div>

Adding this body tag:
<body id="news">

And then adding this style definition:
body#news #news
{
display: block;
}

but it still doesn't display. Is this just not possible? Is there anyway around it?

Thanks!

I am trying to center the whole page. the body contains all divs, contained in one main div. I tried I trick I have been using for a while but it messed with one the other divs. I was using

Margin-Left:-375px; Position:Absolute; Left:50%;

any ideas for another way to center my page?

Hi,

Does anyone knows how i can have css style in the body. The whole coding part should be in the body. I need show link which have the same propertise in a PHP code and I am just editing it. I am trying to work it around this way.

I juts want to have link to another page with different font and font folor change when hover. Can someone show me how i can do this. I am new to css.

Please help me.

At the moment, my BODY tag contains the following CSS:

Code:

BODY {
background: url(images/gradients/bg_top.jpg);
background-repeat: repeat-x;
}

The bg_top.jpg file is an image 200px high, and 3px wide. This displays nicely at the top of my page. It is a gradient from dark grey which fades out to a pattern of simple squares. I would then like these squares to be repeated across the whole of my background.

What I wanted to do was to set a second background image that would display underneath the gradient, but this didn't appear to work. Looking around Google, it appears that you can only set the one background for the body tag. Is this the case? If so, is it possible to set it up so that the square pattern repeats itself across the whole page, but underneath the gradient at the top?

Many thanks.