Need help stoping snagging behavior

HTML & CSS
41

The boder still displaying

The anchors of the more class are #combodiiv #combo, and #acompana and all of them has boder:none; assigned to avoid the boder around the red more bottom display. but still it is displaying.

What was the rule you saw that Had a blue boder assigned?

How much I would like to get rid of that border around the bottom, Lol

42

Why are you telling me you removed the border around the anchor? I told you that you need to remove the border around the images :).

a img{border:0;}
43

I see was trying to eliminate it from the anchor didn’t work.

going to do that.

thanks!

44

very strange in the css style sheet I tried like

#combo #acompana .more a img{
boder:0;
}

and in the html img tag I tried to style inline like:

<div><img src="images/morebottom.gif" alt="more" style="boder:0;"></div>

and then in the firebug it display like:

<a href="#">
<img style="" alt="more" src="images/morebottom.gif"/>
</a>

it display an empty style rule. When I have applied a boder:

in others words it is not grabbing the rule.

45

Yep. You misspelled it :slight_smile:

"boder:0;"

boder? You mean border? :wink:

46

Lol that’s was funny, Let me go and correct it.

Thanks!

47

I corrected the spelling in the stylesheet and it didn’t worked, but then I went and i corrected the misspelling at the inline style and the worked…

thank you!

48

You’re welcome :).

49

Check this, If you go to the div class “more” and click on the link you will see that the <a> tags will color blue and then link. why the <a> tags has that height? I have put it auto so it can get the full size of the morebottom.gif. Well I assume I can do it that way. But how can I make the <a> tags to fit or match the size of it’s child the img tag? Or better said How can I eliminate that blue square that appear when the more bottom is clicked.

i have encounter this issue before.

<div class="more">
<a style="height: auto;" href="#">
<img style="border: 0pt none ;" alt="more" src="images/morebottom.gif"/>
</a>
</div>
50

The blue box is caused by this line

#sidebar1 ul a:active, a:focus { background-color:#0000FF; color:#CC3300; text-decoration:none;}

The background set :slight_smile:

Btw, if you combine rules via the comma, realize that each rule is independant. The a:focus should be “#sidebar1 ul a:focus”

Why do you want the anchor to be the height of the image?

FLoating the anchor or giving hte image display:block; or…heck there are a lot of ways :slight_smile:

51

I thought that the blue box was caused because the anchor was smaller in height than the img file. But now you have said that the caused of the blue box i the focus. Well I will try to display:block the image to see if it display inside the anchor. what I am tryiing is that both the anchor and the img match height’s.

That why i asked you how can I have the anchor to be the same height as the img tag. If you notice when hover the blue boxed is the anchor.

52

setting the background to 0 fixed every link that were displaying the same problem since it uses the same styesheet. I used this psudo value once but I don’t even remember the functions of it. I know it is use to affect links states colors, when it is clicked, hover or something else.

Thank you again.

53

You’re welcome :).

I’m going go take it everything is solved now lol. It would be best if you have any other questions that you start a new thread lol ;). Otherwise this thread will go on forever (you have asked half a dozen questions in this thread now :p, which is fine, but it needs a cut off eventually ;))

54

Cool!

I will star another thread if I come across another question.

:slight_smile: