Forums

The forums ran from 2008-2020 and are now closed and viewable here as an archive.

Home Forums CSS Silly problem really! (background image wont show itself)

  • This topic is empty.
Viewing 5 posts - 1 through 5 (of 5 total)
  • Author
    Posts
  • #24749
    pettisson
    Member

    Hi, I’m making, or trying to make, that 3 state menu(with twist) I want the background image to be the same for every un ordered list item – so I can change the text myself for each list item. In my mind, this seems like childs play with CSS but…
    I got this really silly problem. The background images wont show up!

    Can you guys take a quick peak at the code for me and see if I made some kind of uh – I-dont-know-what-kind of problem, pretty please.

    I also tried to make a test DIV at the bottom of my html and add a background image. It didn’t show up either.
    My image folder IS named "images" and the background image I want to use IS name "button.png" so I’m going mad now because I see no error in my code or anything, and still it wont show!

    HTML

    Code:



    Pettis menutest

      Blimp

      Blimp

      text

    and CSS

    Code:
    * {
    margin: 0;
    padding: 0;
    }

    body {
    font-size: 62.5%;
    font-family: Helvetica, sans-serif;
    background: #ff6677;
    }

    #page-wrap {
    width: 500px;
    margin: 0 auto;
    background: #ff3530;
    border: solid 1px #000000;
    }

    ul#menu {
    list-style: none;
    }
    ul#menu li {
    display: inline;
    background: background: url(images/button.png) no-repeat bottom center;
    display: block;
    height: 55px;
    width: 150px;
    float: left;
    }
    ul#menu li:hover {
    background-position: center center;
    }

    #blimp {background: #990000;
    }

    #blimp img {display: block;
    margin: 0 auto 0 auto;
    }

    #smallhead1 {background: url(images/head1.jpg);
    width: 264px;
    height: 28px;
    }

    Cuddles
    Pettis

    #56993
    apostrophe
    Participant

    Your CSS file is in a folder on the same level as your images directory.

    The path to your images, relative to the CSS file is

    Code:
    background: background: url(../images/button.png) no-repeat bottom center;
    #56996
    pettisson
    Member

    Thank you. Yeah two dots made it. But only in the "test div" at the bottom. It still didn’t show up in the unordered list. Is it not possible maybe. To make background imags for list items in common?

    Code:
    ul#menu {
    list-style: none;
    }
    ul#menu li {
    background: background: url(../images/button.png) no-repeat bottom center;
    display: block;
    height: 55px;
    width: 150px;
    float: left;
    }
    #56997
    apostrophe
    Participant

    Look carefully at the code you just posted. You have ‘background:’ twice, that might have something to do with it.

    #56998
    pettisson
    Member

    geez, I feel I’m asking such stupid questions :( yeah of course it was that problem. I guess I need some air to clear my head so I wont make these silly mistakes.

    Thanks anyway!

Viewing 5 posts - 1 through 5 (of 5 total)
  • The forum ‘CSS’ is closed to new topics and replies.