SitePoint Sponsor

User Tag List

Results 1 to 5 of 5
  1. #1
    SitePoint Enthusiast
    Join Date
    Dec 2012
    Posts
    52
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    Change Image with CSS

    Hello

    I try change the image with this code css, but don't worked. Any suggestions?

    Code:
    @namespace url(http://www.w3.org/1999/xhtml);
    @-moz-document domain('sitepoint.com') {
    
    img[src*="forum_new-48.png"] {
    	background: url("http://imageshack.us/scaled/landing/94/k1x3pv.png") no-repeat !important;   
    }
    }
    Result:

    BRiC1.png

    Thanks!

  2. #2
    Gre aus'm Pott gold trophysilver trophybronze trophy
    Pullo's Avatar
    Join Date
    Jun 2007
    Location
    Germany
    Posts
    5,312
    Mentioned
    177 Post(s)
    Tagged
    8 Thread(s)
    Hi there,

    And welcome to the forums.

    What exactly is it you are trying to achieve here?
    The background property is shorthand property used to apply various background effects to an element, such as a <div>
    I'm not sure it really makes sense to apply a background image to an image.

  3. #3
    SitePoint Enthusiast
    Join Date
    Dec 2012
    Posts
    52
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Quote Originally Posted by Pullo View Post
    Hi there,

    And welcome to the forums.

    What exactly is it you are trying to achieve here?
    The background property is shorthand property used to apply various background effects to an element, such as a <div>
    I'm not sure it really makes sense to apply a background image to an image.
    I'm trying create a theme in offile mode. The solution for my question is:

    Code:
    img[src*="original_image"]{
        background-image: url("new_image") !important;
        background-repeat: no-repeat !important;    
        width:25px !important;
        display:inline-block !important;
        padding:25px 0 0 0 !important;
        height: 0px !important;
    }
    I have one more question, it is possible to add a button next to the 'quote'? Only with CSS offline mode. For create a theme


  4. #4
    Gre aus'm Pott gold trophysilver trophybronze trophy
    Pullo's Avatar
    Join Date
    Jun 2007
    Location
    Germany
    Posts
    5,312
    Mentioned
    177 Post(s)
    Tagged
    8 Thread(s)
    Well, I'm glad you managed to find a solution to your original problem, but I still can't see any practical value to replacing one image with another in this way.
    Also, what's going on with the height:0px?

    Quote Originally Posted by Fantastic5 View Post
    I have one more question, it is possible to add a button next to the 'quote'? Only with CSS offline mode. For create a theme

    I wouldn't know how to add an element to a page using CSS.
    You can do this easily enough with JavaScript (or just in the HTML), but that doesn't deem to be what you're asking.

    Can anyone else shed any light??

  5. #5
    SitePoint Enthusiast
    Join Date
    Dec 2012
    Posts
    52
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    I managed to put the image, but missing the link to picture.

    .postarea :before{
    content: url("link_here");
    }


Bookmarks

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •