Help!!

Discussion in 'HTML & Website Design' started by headjam, Jan 14, 2013.

  1. #1
    Hi Everybody.

    I've join this joly forum looking for some help, cause I'm trying to arrange my gf blog and some parts are really bugging me:\

    The url is: callmemisslilsusie.blogspot.pt ..and I'm trying to split the top bar in three separate tabs.

    [​IMG]
    fig 1 - this is the problem, I've already found how to make the green stripe disappear, but can't put my own images in there.

    [​IMG]
    Fig 2 - And this is how I would like to have, three, separate top tabs with my own design.

    Thanks in advance for anyone who could help me:D
     
    Last edited: Jan 14, 2013
    headjam, Jan 14, 2013 IP
  2. Hefaistos

    Hefaistos Active Member

    Messages:
    194
    Likes Received:
    14
    Best Answers:
    9
    Trophy Points:
    63
    Digital Goods:
    1
    #2
    We can't help you without seeing your website, so , a url will be helpful.
     
    Hefaistos, Jan 14, 2013 IP
  3. headjam

    headjam Greenhorn

    Messages:
    12
    Likes Received:
    0
    Best Answers:
    0
    Trophy Points:
    11
    #3
    sorry, you are absolutely right.

    ..the url is up there in bold.
     
    headjam, Jan 14, 2013 IP
  4. sadamsam

    sadamsam Greenhorn

    Messages:
    9
    Likes Received:
    1
    Best Answers:
    1
    Trophy Points:
    13
    #4
    try with the following code.

    /* html here ..... */
    <div class="content-widget">
    <ul><li><a href="http://callmemisslilsusie.blogspot.pt/">home</a></li>


    <li><a href="http://callmemisslilsusie.blogspot.pt/p/sobre-mim.html">about me</a></li>


    <li><a href="http://callmemisslilsusie.blogspot.pt/p/http-pin-up-cherry.html">contacts</a></li>



    </ul>

    </div>

    /* css here .... */

    .widget-content ul
    {
    margin:0;
    padding:0;
    }
    .widget-content ul li
    {
    width:auto;
    max-height:32px;
    float:left;
    list-style-type:none;
    margin:3px 0px 0px 0px; // (top,right, bottom,left)
    }
    .widget-content ul li a
    {
    width:auto;
    text-align:center;
    color: #666666;
    background: url("http://4.bp.blogspot.com/-z6fLvK2emhE/UO9_VpN8o4I/AAAAAAAAAqs/z1FfVqTyblI/s1600/header%2B2.0.jpg") repeat scroll 0 0 transparent;
    text-decoration: none;
    }
    .widget-content ul li a:hover
    {
    text-align:center;
    color: #666666;
    background: url("http://4.bp.blogspot.com/-z6fLvK2emhE/UO9_VpN8o4I/AAAAAAAAAqs/z1FfVqTyblI/s1600/header%2B2.0.jpg") repeat scroll 0 0 transparent;
    }

    if any error please tell, All the best.
     
    sadamsam, Jan 15, 2013 IP
    headjam likes this.
  5. headjam

    headjam Greenhorn

    Messages:
    12
    Likes Received:
    0
    Best Answers:
    0
    Trophy Points:
    11
    #5
    WOW..really thanks, work just fine.

    Just a question:
    ERROR 1-I've put my custom url in the red areas, but it didn't centered the images(as you can see in the blog)..any tips on how can I center the images?
    ERROR 2-Oh..and the custom tab appear behind in the achieves, how can I take this.

    [​IMG]
    fig 1 - errors

    [​IMG]
    fig 2-custom tab

    sorry for being a pain, but html\css isn't my playfield..thanks for all the help:D
     
    Last edited: Jan 15, 2013
    headjam, Jan 15, 2013 IP