For example, I have an image in a community website that I want to hide, but it's not contained inside any codes like

#413412

uhm, do you mean something like ? :confused:

#413413

It's an image, provided by the website. So let's say the image says

and it's not nested between some

or

#413417

got it now yep, there are complex selectors in css, not sure they are supported everywhere. It should be something like

img[src=http://....] { }

#413420

Is it really enclosed in [ and ] ?

I've tried:

img[src=http://....] { } (what you've provided)

img[";http://...."]'>;http://...."] { } (with double quotes)

img['http://....'] { } (with single quotes)

img[src=http://....] { } (with src and no quotes)

img[http://....] { } (no quotes)

img(src="../../unavailable.html";http%3A//....">;http://....") { }

img(";http://....") { }

all unsuccessful

#413423

img[src~="img/logo.gif"] {display: none;}

That's known as the partial attribute selector. I don't believe Internet Explorer supports it (or dreadnaut's solution either). Use any portion of the value of the src attribute.

-NC

#413515

Nightcrawler, here is the image source:

How will I work my way through it? Sorry I'm still new to CSS coding til now.

#413527

img[alt~=designs] {display: none;}

I believe that will hide any image whose alt tag contains the word "designs".

-NC

P.S: We've all been new to CSS coding at one point or another!

#413535

You are a god-send, NC!

About texts, can I replace the text contents of a page using CSS?

#413681

.

What do you mean when you say replace? You can use the :before and :after pseudo-classes to position content before and after certain elements, and then you could use display: none to hide the element itself. This is really more of a hack, and Internet Explorer 6 doesn't support these pseudo-classes anyway...

-NC

#413869

NC, I need your help with this one. How can I change the image and remove the padding/border in it by using CSS?

#414932

an easy way would be to use display:none to hide the image and add a background image to your a tag

#414995

pwnzrzpat, please give me an example based on the code I posted. I kinda forgot about coding and stuff

#415027

a {display: block;
width: 160;
height:120;
background-image: http://link/to/image.jpg;
background-repeat: no-repeat;
background-position: xpx ypx;}

a img {display: none;}

You can leave out background-position entirely and it will default to "top left." If you want it in (unlikely), specify it using the format I provided. Negative numbers, percentages, and standard directions (top, left, bottom, right) are acceptable.

Hope this helps!

-NC

P.S: We have to go to these great lengths because inline styles override external style sheets. Thus, you can't just specify the image with an ID using an external stylesheet, and then set the padding and border equal to 0px. This is more of a workaround.

#415075

NC, when i use that, all of the other images are hidden as well. Not just the one I want to hide. Noticed that there is the alt attribute? Can I just use that to be able to change the existing image to my own and remove the paddings/margins around the image?

The circled three are

[*]'s and I want to hide/remove the Designs tab. Is there a way to do this? Each

[*] doesn't use any attribute so its hard to get around.

#415101

Don't double post .

Try using this more specific code to specify the image.

a img[alt~="kaloyster"] {display: none;}

As for removing the designs tab, try the following code...I've used a variant of this sucessfully, so I believe it should work. For your purposes, "visibility: hidden;" might work just as well as "display: none;".

li a[href~="kaloyster/submissions"] {
width: SET TO WIDTH OF TAB (~= width of li element)
height: SET TO HEIGHT OF TAB (~=height of li element)
display: none;

#415133

NC! I manage to remove the Design tab. Thanks much!

This is the last one, I don't want to remove the image on this one

I just want to put an image above it like a banner across. How to pull it off? So it will leave the image and put another image on top of it? Like example our avatars here. It exists, now I want to put an image above my avatar. How to code it?

#415162

I think you'd have to make a div.

.banner{
background: #FFF url(path/to/image.jpg); 
height: <img height>; 
width: <img width>;
}

.otherimg{
margin-top: -10px;
}

And then..

<td style="padding-right:20px;">
<a href="../../unavailable.html">
<div class="banner"><Content></div>
<img src="http://link/to/image.jpg" width="160" height="120" alt="kaloyster" style='padding:4px;border:1px solid #ACE1F9;' class="otherimg" /></a>
</td>

Oh and I don't believe the avatars are images ontop of images. I think it's done like..

.avatar{
border: 1px solid #CCC;
padding: 4px;
}

#415236