div inside span

Do you have a question? Post it now! No Registration Necessary.  Now with pictures!

Threaded View
Hi There,

Please consult
I would like to display a div positioned to the left of the little
pereview icon when the cursor is hovering over it.
For the mouseover effect of the pereview img, i'm using a <span>:hover
css effect and then within that effect i would like to place a <div>
that would be displayed if "pereview" is hovered - does this make
It however doesnt work and w3c validator tells me following: "document
type does not allow element "div" here" - any clues on how i solve
this properly?
Thank you for hints or suggestions!

Re: div inside span

cerr wrote:

Quoted text here. Click to load it

That's basically a CSS question, not HTML, but yes, the approach makes

Quoted text here. Click to load it

The HTML side of the matter is simple: the syntax disallows <div> within
<span>. But you can use <span> inside <span> and style its rendering as
block-like (display: block) in CSS if needed.

The syntax error might have nothing to do with the styling difficulties, but
it is better to fix it before posting a styling question to

Yucca, http://www.cs.tut.fi/~jkorpela/

Re: div inside span

Quoted text here. Click to load it

You might be able to get rid of the span completely. You currently have:

<div class="nav">
   <a href="index.php?sel=home">
      <span class="hilight">H<span class="lolight">ome</span></span></a>

[changed the line breaks to fit 80 columns]

However, you don't really need the second span since you can style links
within a div of class nav, and just style the first character
differently.  And CSS also provides a way of specifying a different style
for the first character, although this likely won't work for every
browser. See:  

In other words, you can reduce the above to a simple link within a div,
which should make what you want a little easier.

A word about the functionality of your current design, though: I find the
green you've chosen very hard to read against the white background, and
the effect of having the first character effectively disappear when I
move the cursor over the link is distracting.

Also, the first time I fetched your page there was a short delay before
your background image loaded.  When it did, the sudden change in
background was startling - I actually flinched when it happened! I
think you could quite safely lose it without taking anything away from
your site.

Quoted text here. Click to load it

Site Timeline