Prev | Current Page 165 | Next

Charles Wyke-Smith

"Stylin' with CSS: A Designer's Guide 2nd Edition"


div#respond {background-color:blue;}
div#respond:hover {background-color:red;}
This is a very useful feature, and the key to creating CSS-based menus, but
Internet Explorer 6 doesn??™t produce a hover effect for any selector except a, a
link. Fortunately, a very smart programmer, Peter Nederlof, came up with an
Internet Explorer behavior that solves this problem. The ?¬? le is called
csshover.htc and you can download it from www.xs4all.nl/~peterned/
hovercraft.html. Here??™s how you add it to the CSS.
body {font:1em verdana, arial, sans-serif; behavior:url(css/
csshover.htc);}
In this example, as the URL for this ?¬? le indicates, I created a new folder
called css in the same folder as the ?¬? les for this example and put the
csshover.htc ?¬? le in that folder. If you decide to put the ?¬? le in a different
location, you will need to modify the URL.
With the csshover.htc ?¬? le associated with your ?¬? le in this way,
Internet Explorer can respond to hovers. Now, across all of our target
browsers, the background of the list item turns white when it is
hovered over.
Take time to review and understand the three important examples
shown in this chapter:
??? Creating a column with an inner div and nested elements
??? Clearing ?¬‚ oated elements
??? Controlling the positioning and display of elements using the
position and display properties
These techniques are integral to creating page layouts with CSS,
which is the subject of our next chapter.


Pages:
153 154 155 156 157 158 159 160 161 162 163 164 165 166 167 168 169 170 171 172 173 174 175 176 177