img element CSS editing

[Siskow]

Hello,

I am posting because I have had relentless issues with editing the CSS for the image elements.  I am trying to set a border around all images using, " a img {border: ;} " and " img {border: ;} ".  When I add a border of 1px thats red ( "img {border: 1px red;}" ) it does not add a border around any images on my website at all.

[Adam7]

Is your site live, @Siskow? If you post a link that'll help people troubleshoot that for you.

[Siskow]

http://www.studiomrm.com/gear.html

[kriskrost]

Hi Siskow,

Here is a quick markup that you can use to play with, this will add a red border on any images with a link. You may want to make the class more specific to only effect certain images. 

.wsite-image a img {
    border: 1px solid red !important;
}

[Siskow]

Thank you so much, this is the first response I have gotten that is actually what I needed help with.  I couldn't figure out the element tag because just img wasn't working haha.  You may be able to help me with this as well but my ultimate goal is to remove the grey borders that appear in the "sleek" mobile theme when the page is resized to a larger mobile device.  I'm having no luck so far.  I thought using "border-style: none;" or "border: none;" would solve it but I am starting to suspect that weebly uses a different stylesheet that I do not have access to for mobile themes as opposed to the desktop theme.  

[kriskrost]

Hi Siskow,

The code that's causing this grey area is as follows. The inspector says it's line 168 but it may or may not be in the css file, but either way, you can just paste this in to recreate the class. You would change the numbers to a different color such as black which can be changed by switching it to #000000 for both color schemes. you could also add that !important tag to make it overwrite what's there. 

.wsite-mobile .wsite-image {
    background-image: linear-gradient(to top, #515151, #656565);
}

 Here is a sample of making it black. 

.wsite-mobile .wsite-image {
    background-image: linear-gradient(to top, #000000, #000000) !important;
}

[HB21]

How would I make this class more specific to only reference certain photos? For instance, I am trying to make the photos on my home page to expand when your mouse hovers over them.