1. Advertising
    y u no do it?

    Advertising (learn more)

    Advertise virtually anything here, with CPM banner ads, CPM email ads and CPC contextual links. You can target relevant areas of the site and show ads based on geographical location of the user if you wish.

    Starts at just $1 per CPM or $0.10 per CPC.

Two Questions Here Regarding CSS + HTML

Discussion in 'HTML & Website Design' started by coreygeer, May 12, 2012.

  1. #1
    Question #1:
    I've implemented a CSS and Jquery menu drop down and it seems to work great on FF and Chrome
    t(-.-t) to Internet Explorer even though I have the "hacks" and "fixes" implemented that are supposed to make it work.. regardless.

    Here's my question: I want to put an arrow or bullet point next to the items that have a sub-menu

    Example:

    Item 1
    Item 1.1
    Item 1.2
    Item 1.3
    Item 1.3.1
    Item 2
    Item 3

    I want an arrow or to know how to place an bullet point or image next to say "Item 1" and "Item 1.3" to signify that there's more content than just that tab.

    The website: http://www.kbwarriors.com/

    The code:
    Code (Text):
    1. /* THE CSS MENU * KEEP COLORS:#1B1B1B, #808080, #282828, #FFD100*/[/LEFT]
    2.  
    3.  
    4. #nav {float:left;margin:0;padding:0;}
    5. #nav li a, #nav li {float:left;border-radius: 60px 15px / 60px 15px;}
    6. #nav li {list-style:none;position:relative;}
    7. #nav li a {padding: 8px 1.5em;text-decoration:none;color:white;border-right:1px solid #808080;border-left:1px solid #404040;border-top:1px solid #404040;
    8.    background-image: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#808080), to(#1B1B1B));
    9.    background-image: -webkit-linear-gradient(top, #808080, #1B1B1B);
    10.    background-image: -moz-linear-gradient(top, #808080, #1B1B1B);
    11.    background-image: -ms-linear-gradient(top, #808080, #1B1B1B);
    12.    background-image: -o-linear-gradient(top, #808080, #1B1B1B);
    13.    box-shadow: inset 3px 3px 15px #404040;
    14. }
    15. #nav li a:hover {background:#282828;color:#FFD100;
    16.    background-image: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#808080), to(#000));
    17.    background-image: -webkit-linear-gradient(top, #808080, #000);
    18.    background-image: -moz-linear-gradient(top, #808080, #000);
    19.    background-image: -ms-linear-gradient(top, #808080, #000);
    20.    background-image: -o-linear-gradient(top, #808080, #000);
    21.    box-shadow: inset 3px 3px 15px #000;
    22. }
    23. /* SUBMENU */
    24. #nav li ul {display:none;position:absolute;left:0;top:100%;padding:0;margin:0;}
    25. #nav li:hover > ul {display:block;}
    26. #nav li ul li, #nav li ul li a {float:none;}
    27. #nav li ul li {_display:inline;} /* FOR IGNORANT IE6 USERS */
    28. #nav li ul li a {width:150px;display:block;}
    29.  
    30.  
    31. /* SUB SUB MENU */
    32.  
    33.  
    34. #nav li ul li ul {display:none;}
    35. [LEFT]#nav li ul li:hover ul {left:100%;top:0;}[COLOR=#000000]
    Question #2: What do you do about AdBlock?

    Over 1+ Million people have installed this thing and it effectively blocks out Adsense, YPN and other ad sources (which is just a stupid idea in the first place). So how do you go around this? My main advertising platform was going to be Adsense but now i'm worried that too many people have this addon installed and it'll hurt clicks and revenue once the site gets a decent amount of traffic.[/COLOR]​
     
    coreygeer, May 12, 2012 IP
  2. fotogrph

    fotogrph Peon

    Messages:
    33
    Likes Received:
    0
    Best Answers:
    0
    Trophy Points:
    0
    #2
    For #1 just style the .hasChildren class to show an arrow. eg..

    Code (Text):
    1.  
    2. .haschildren {
    3. background: url(images/arrow.png) no repeat top right;
    4. }
    5.  
     
    fotogrph, May 12, 2012 IP