Vanilla 1 is no longer supported or maintained. If you need a copy, you can get it here.
HackerOne users: Testing against this community violates our program's Terms of Service and will result in your bounty being denied.

CSS Help - Please

edited August 2006 in Vanilla 1.0 Help
I have builing a fancy CSS Image Map for a phone keypad. Here is the link to the file: I have not testing this in IE on windows yet, so if anyone could, that would be great, but I have the following problem. The links of the left-most column (1, 4, 7, *) all span all the way from the left of the white box. I don't want it to do this. I only want the link to start from the edge of the button. If anyone could help, that would be great. Here is a link to the CSS file for the navigation:


  • Options
    They look fine in IE.
  • Options
    edited August 2006
    The 15 links (0-9 * # cancel clicker ok) span all the way, the five on the left are just on top of the others (higher z-index) ...

    You could slice main.jpg in three: the top left of the cancel button being at the edge of a left + top right + bottom right images. Substract the width of the left image to the CSS values and the new left of your links will be where you want it to be.
    But I would strongly suggest you to use the true image map (and area) with alts (an example in Starbucks menu (I wonder why they didn't use ul/li-based menus but still, their implementation of map/area is technically OK).
  • Options
    I tested it in IE today and all the links work fine. It will work in every browser (that I can tell). I would rather not use the traditional Image Map. I think they are a little dated and I have trouble with them in particular situations. CSS is what I will be using. Thanks for your help/ suggestions. I am going to give it a bit more thought and see if I can come up with a better way to do it.
This discussion has been closed.