SitePoint Sponsor

User Tag List

Results 1 to 3 of 3
  1. #1
    SitePoint Member
    Join Date
    Mar 2010
    Posts
    16
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    Question Button Visibility Issues

    Hi again guys/girls,

    I've run into a bit of a snag - I was asked to create an alternate language version of this site since I'm in Canada, and the language toggling button or div will not work across all browsers.

    IE8: works
    FF: nope
    Chrome: nope
    Safari: untested

    The language link is an area map right underneath the navbar in the upper right. It says 'FRANCAIS' on the homepage.

    the relevant code:
    Code HTML4Strict:
    <div id="langBar"> <img src="img/langBar2.jpg" alt="Language Bar" width="915" height="20" border="0" usemap="#language" />
                <map name="language" id="language">
                    <area shape="rect" coords="846,2,913,20" href="html/fr/index.html" alt="francais" />
                </map>
            </div>

    and css:
    Code CSS:
    #langBar {
    	height: 20px;
    	width: 915px;
    	position: absolute;
    	margin-top: 41px;
    	z-index: 50;
    }

    the site is www.ocoiffurespa.com

    any ideas why it isn't clickable? any help would be really appreciated (again)

  2. #2
    The CSS Clinic is open silver trophybronze trophy
    Paul O'B's Avatar
    Join Date
    Jan 2003
    Location
    Hampshire UK
    Posts
    39,797
    Mentioned
    158 Post(s)
    Tagged
    3 Thread(s)
    Hi,

    Try raising the z-index to bring it on top of #content.

    Code:
    #langBar {
    height:20px;
    margin-top:41px;
    position:absolute;
    width:915px;
    z-index:2;
    
    
    }

  3. #3
    SitePoint Member
    Join Date
    Mar 2010
    Posts
    16
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Seems like something from my original css wasn't taking, or stack values don't like arbitrary numbers. I have the z-index at 3 (navbar at 2) and it's working. Thanks for helping, as always Paul is the best!


Bookmarks

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •