The Lodge is members-only design/dev videos and Office Hours.

Next Office Hours Session: "Implementing an SVG Icon System" Nov 30 - 6:00 PM Eastern

Navigation bar with image

  • # January 30, 2013 at 12:06 pm

    it is my target navigation

    but I have made this :(

    Here is my HTML code

    Here is my CSS

    #page-wrap #content aside ul li {
    float: left;
    height: 40px;
    width: 40px;
    list-style-type: none;
    display: inline-block;


    whats wrong I have done ? How can I make it similar to target

    # January 30, 2013 at 12:14 pm

    This reply has been reported for inappropriate content.

    Hey, welcome!

    The only way we can really do anything is if you give us enough code to work with. Try putting the necessary parts (read: more than you posted here, but less than your entire page) of your code into CodePen. Here’s how

    # January 30, 2013 at 12:30 pm

    Seems easy to me:

    # January 30, 2013 at 12:37 pm

    here is my HTML , here is my CSS ,

    plz help me

    # January 30, 2013 at 12:38 pm

    Paulie beat me to it, I would move the float to the li however.

    # January 30, 2013 at 12:44 pm

    Thanks paulie its working

    # January 30, 2013 at 12:45 pm

    Your placing an image (of any size) sized down to 60×50 px into a anchor of 40×40 with the overflow:visible, so they overlap…

Viewing 7 posts - 1 through 7 (of 7 total)

You must be logged in to reply to this topic.

There's a whole bunch of content on CSS-Tricks.

Search for Stuff   •   Browse the Archives

Get the Newsletter ... or get the RSS feed