0

I'm making a portfolio for my 8th grade exit interview with HTML, Javacript, and CSS. For some reason, after my CSS animation plays, my anchor tags no longer work.

You can see a demo here.

Here is my code for one of the links:

<a href="#" onclick="one()"><div class=img id="img1"> </div></a>

And my css:

@keyframes secondwindow
{
    from { opacity:0; }
    to { opacity:1; }
}
@-moz-keyframes secondwindow
{
    from { opacity:0; }
    to { opacity:1; }
}
@-webkit-keyframes secondwindow
{
    from { opacity:0; }
    to { opacity:1; }
}
@-o-keyframes secondwindow
{
    from { opacity:0; }
    to { opacity:1; }
}
JSW189
  • 6,267
  • 11
  • 44
  • 72
Thomas Lai
  • 317
  • 1
  • 6
  • 15
  • 1
    I think you problem is this: http://stackoverflow.com/questions/3092610/div-inside-link-a-href-tag – NRAM Dec 08 '12 at 20:42

1 Answers1

0

The problem is that the divs are floated but the containing a isn't, so the as end up with effectively no dimensions. A simple solution would just be to also float the as.

Matt Whipple
  • 7,034
  • 1
  • 23
  • 34
  • so if I do – Thomas Lai Dec 08 '12 at 20:49
  • Yes, or in the CSS. You may want to re-work it so the `a`s dictate the layout, but this is a simple fix to get you where you need to go. – Matt Whipple Dec 08 '12 at 20:51
  • It should fix the containment issue. `#section1` is also layered on top of the entire page so that will block actually clicking the links. Remove the `z-index` on that element. I'm not sure what `one` is supposed to do, but swapping that for test handlers works fine. – Matt Whipple Dec 08 '12 at 21:20