1

I have a .css file as below:

body { background-color:#ffffff; font-size:12px; line-height:18px; padding:0px; margin:0px; padding-top:10px; } ul,h1,h2,h3,li,p { padding:0px; margin:0px; } img { border:0px; } .wrapper { margin:0px auto; width:98%; border:solid 0px red; } 

This css applies for all the pages in my web site. If you observe, the border for all image tags is set to NONE.

Now, only in a particular page, I had a image tag as below:

<img border="1" src='../something'/> 

The image comes properly, but the border doesn't. I need to have border for this image tag, I do not have to use style attribute cause this image tag is generated by an HTML web editor where it adds an attribute "border=1" instead of style attribute.

How can I achieve this??

Is there a way to remove a particular css class for a page?

The other way I'm trying is for the client events of the web editor to change border=1 to style="border:1" (this works)

2
  • 1
    style = "border: 1px" is indeed the best solution to the problem. Commented Apr 6, 2011 at 15:01
  • 1 - can you not edit the image tag since it is generated? 2 - are there other image tags on the page that should not have a border? Commented Apr 6, 2011 at 15:03

3 Answers 3

3

If you can ID a parent element uniquely, such as the body tag:

<body id="myUniquePage"> 

then you can create a more specific style for that page:

#myUniquePage img {border: 1px solid red;} 

Of course, you probably don't want all images on the page with that border, so you'd want to target a more specific container on the page...perhaps a DIV that surrounds the content that the text editor created.

Sign up to request clarification or add additional context in comments.

2 Comments

are there other image tags on the page that should not have a border? YES
Are the images that you want to have a border in the same area of the page?
0

If you can add a class attribute to the body tag of the page for which you want to override the default style, then you could define an override for that page by using a CSS decendant selector as follows:

body.mypage img { border:1px; } 

However you should be aware that this will affect every image on the page. If you want to localize where this override takes effect, then you could apply the same technique to a container closer to the image(s) in question, for example, a containing div:

div.mydiv img { border:1px; } 

Comments

0

You could add instead of removing.

Add another stylesheet to the page, with the following style:

img { border: 1px solid red; !important } 

as both tags are identical, this should be used instead of the one defined in the general css file.

2 Comments

this applies for all the image tags, I need to apply border only for a particular image, the best solution I think: change border=1 to style='border:1' in the client events of the web editor(now I need to google for the client events of the infragistics web editor !!!)
Yes, if you can manage that, it would be a surgical solution, what I'm proposing is more of a sledgehammer solution.

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.