Click here to Skip to main content
13,357,973 members (58,778 online)
Rate this:
Please Sign up or sign in to vote.
See more:

i have a blogger blog, in which i have used .post-body img attribute to set background image for all images in posts,i have used it in template.

.post-body img{
padding: 15px;
background: white url( top repeat-x;
border: 1px solid #DEDBD1;
margin: 5px 5px 5px 5px;

but due to some reasons in some posts i don't want to use background image in post images, so i found !important rule to use for it and add it in new post image attribute, but it does not work,

<pre><span class="style28"><img height="30" src="" background-image: none !important; style="border: 0px; height: auto; max-width: 100%;" width="30" />&nbsp;All popular browsers and applications are supported!</span>

but it does not work, so please help me to use it properly.
Posted 30-Sep-12 0:53am
Updated 30-Sep-12 19:00pm
Rate this: bad
Please Sign up or sign in to vote.

Solution 2

!important if for overriding higher priority attributes, and not for higher level attributes. An example: something specified in the style attribute overrides what's specified in the css class. Also css class name order in the class attribute is messing up the effective style. As well direct specification will override cascaded one. But if you have an outer element with any css specification and an inner element with an other one, the inner specification will simply override the inherited one. So you have multiple choices.
But anyway specifying background-image: none !important; will have it's effect, if any other higher priority specification is not available on place.

According to your code posted, you are using the style in a wrong manner.
<span class="style28"><img height="30" width="30" src="" style="border: 0px; height: auto; max-width: 100%; background-image: none !important;" />All popular browsers and applications are supported!</span>

After all it is not wise to mix css, inline style and inline formatting attributes.
Sergey Alexandrovich Kryukov 30-Sep-12 13:28pm
My 5. I can also add that important cannot 100% guarantee the rule (hence the name; otherwise it could be called something like "mandatory" :-), for example, the directive can be valid, but the rule itself not implemented by particular layout engine. These days when the new standards like HTML5 are only partially implemented, this is a usual case.
Rate this: bad
Please Sign up or sign in to vote.

Solution 1

#example {
    background-image: none !important;

Have a look at these to know more:
The CSS Important rule[^]
Using !important with CSS[^]
!important CSS Declarations: How and When to Use Them[^]
When Using !important is The Right Choice[^]
askfriends 30-Sep-12 6:13am
thanks for quick response.
but you have not understood my question. I want to remove background image while your solution suggests to add new image.
how can i remove background image from post images as i have already set above mentioned post-body img attribute.
Sandeep Mewara 30-Sep-12 6:52am
I gave sample example earlier. Updated with exact what you need.
askfriends 1-Oct-12 0:51am
didnt work both solutions, i have updated my question
Sandeep Mewara 1-Oct-12 2:07am
Add this as one of the properties in STYLE: background-image: none !important;

Best way of implementation is to define CSS stylesheet and handle all these there. In HTML, just play with CSS class names. It will work. try out.
askfriends 1-Oct-12 2:15am
thanks sandeep for kind response.
i have also did it but it didnt work.
i created new class in template style and added your mentioned code in it, but in vain..!
Sandeep Mewara 1-Oct-12 2:17am
There must be some mistake. I have done it in past and was all good and working.

Make sure that the CSS is getting applied. Try to put a border or backcolor to check if it is.

This content, along with any associated source code and files, is licensed under The Code Project Open License (CPOL)

  Print Answers RSS
Top Experts
Last 24hrsThis month

Advertise | Privacy |
Web01 | 2.8.180111.1 | Last Updated 1 Oct 2012
Copyright © CodeProject, 1999-2018
All Rights Reserved. Terms of Service
Layout: fixed | fluid

CodeProject, 503-250 Ferrand Drive Toronto Ontario, M3C 3G8 Canada +1 416-849-8900 x 100