Welcome to WebmasterWorld Guest from 54.167.213.22

Forum Moderators: not2easy

Message Too Old, No Replies

fighting with :hover

making IE do something better

     
9:59 pm on Feb 21, 2003 (gmt 0)

10+ Year Member



Well, as you know, only a:hover works for IE, right?

THe thing is, I want an entire div to turn colors when the mouse comes over it. But, with IE, only the text in the A link changes colors, even if you set the A tag's width:100%.

now, if you change the display type of A to display:block, then I get the effect I want, except now in mozilla, I get an extra carriage return. (IE doesn't show it, but I suppose it probably should) Other than making carriage return-height 0px (can't think of the actual CSS property just now), is there anyway in CSS to make a block element, but such that it doesn't have a automatic carriage return?

thanks!

10:25 pm on Feb 21, 2003 (gmt 0)

WebmasterWorld Senior Member 10+ Year Member



Try setting the size of the div and the anchor tags the same value.

.thediv
{
width: 100px;
height: 100px;
}

.thediv a
{
width: 100px;
height: 100px;
}

<div class="thediv">
<a href=""></a>
</div>

Suzy_Uk helped me out with the same thing(can't find the thread). As far as the carriage return, I've noticed some strange things also.

When I put two images next to each other like this:

<img src="" alt="" />
<img src="" alt="" />

There is a space between them on the page. If I put them on the same line like this:

<img src="" alt="" /><img src="" alt="" />

No space. I can't answer that one :(

10:36 pm on Feb 21, 2003 (gmt 0)

WebmasterWorld Senior Member 10+ Year Member



The image space thing is a problem with the browsers interpreting HTML spec. Whitespace is supposed to be ignored, but not if it is part of text. The problem is determining whether or not your space or newline is text or source code formatting. Most browsers just ignore the problem and render all whitespace as a single space on the screen (even if there are multiple whitespace characters in a row, it is still rendered as a single space.
3:18 pm on Feb 23, 2003 (gmt 0)

10+ Year Member



Here is something else tat seems simple, but I dont know if it can be done. after much googling, I have to admit defeat:

is their anyway to change another class/id's properties in an a:hover{} statement?

Something that would be like:

a:hover{background-color:orange
#otherElement:background-color:yellow}

im just doing what I can to avoid javascript :) im not stranger to it, but I would simply rather not have it hehe

3:21 am on Feb 24, 2003 (gmt 0)

10+ Year Member



Well I thank you very much Birdman: i swear there must be a way to make this work: i tried what you told me, but I am using percentages.. perhaps thats just not working because of this fact.

But thanks anyway! If i find the answer, Ill post it, of course

 

Featured Threads

Hot Threads This Week

Hot Threads This Month