background inside html on li with class ???

Discussion in 'Web Design and Development' started by umbilical, Jan 31, 2009.

  1. umbilical macrumors 6502a

    Joined:
    May 3, 2008
    Location:
    FL, USA
    #1
    hi I need insert a style background inside the html on a li with a class, but I cant! I need inside the HTML not outsite .css

    <li class="first" style='background: url(../img/image.jpg) no-repeat;'><a href="#">Text Text Text</a></li>

    whats wrong in my code? help please, thanks
     
  2. tominated macrumors 68000

    tominated

    Joined:
    Jul 7, 2006
    Location:
    Queensland, Australia
    #2
    instead of using double quotes for the css styles, use single quotes and use the double quotes to contain the css instead of single quotes.
     
  3. umbilical thread starter macrumors 6502a

    Joined:
    May 3, 2008
    Location:
    FL, USA
    #3
    I dont understand you sorry, help
     
  4. majorp macrumors 6502

    Joined:
    Nov 28, 2005
    Location:
    UK !!!
    #4
    Your code works fine for me in safari. You probably have the location of the image wrong.

    What tominated means is this

    <li class='first' style="background: url(../img/image.jpg) no-repeat;"><a href="#">Text Text Text</a></li>
     
  5. SrWebDeveloper macrumors 68000

    SrWebDeveloper

    Joined:
    Dec 7, 2007
    Location:
    Alexandria, VA, USA
    #5
    The syntax is fine.

    When doing inline styling, that overrides any settings set in a class or ID. However, if it turns out the path is right, we'd need to see what properties are being set in the "first" class, i.e. sometimes people forget to set width and height properly and the background image won't show as the space is too small. Or countless other causes.

    -jim
     
  6. centered effect macrumors newbie

    Joined:
    Sep 20, 2007
    #6
    Inline styles are bad practice as CSS should be styling and separated from the content. Also as SrWebDeveloper stated, if you have other properties for the class "first" then that may be conflicting with the code.

    Code:
    <DOCTYPE ....
    <html>
    <head>
    <style type="text/css">
    .first {
       background: url("image.jpg") no-repeat;
    }
    </style>
    </head>
    <body>
    ...
    <li class="first><a href="#">Blah blah</a></li>
    ...
    </body>
    </html>
     
  7. umbilical thread starter macrumors 6502a

    Joined:
    May 3, 2008
    Location:
    FL, USA
    #7
    thanks I resolve... I forget remove the same line on the external .css

    thanks! ;)
     

Share This Page