100% width to image

tuomot · December 2015

hi!

how i can change image class img.scale-with-grid, #Content img . i want my image to be width: 100%; , but if i change that img-scale-with-grid max-widht to just width it takes effect to every image.

i was trying to add extra class to custom css and put that class to muffin builder but that doesent work, any ideas ?

Albert · December 2015

Hi,

please send us url to page where you have images that you want to increase and we'll see if it is possible. As we know, images are already 100% width and we are not sure if this would be possible.

Thanks!

tuomot · December 2015

http://sommeil.fi/towermedia/ . its fullscreen now at 1920x1080 but if you press like ctrl + - it would be smaller. if you change:

img.scale-with-grid,#Content img {

        max-width: 100%;
        height: auto;

to

img.scale-with-grid,#Content img {

        width: 100%;
        height: auto;
}

it works as it should.

Albert · December 2015

If changing max-width to width is fine for you than we're happy to hear that. However, for many people it does not work as should and that's why we use max-width attribute instead.

tuomot · December 2015

its not working ! because its effect every imsge. i would like that only for that one picture.

Albert · December 2015

We thought that you sorted it already. If you want to apply above css for one image only, then set class name for the image which you want to change and then modify above css. If you will set class name for the image and tell us what's the name of the class we can have a look on it once again and see if this would be possible for one image only.

tuomot · December 2015

i alredy try it, but it doesent take effect. made custom class css to custom css. its called

kuva {

width: 100%;

height: auto;

}

and add that to image: Custom | Classes

but please try solve it, it would be very nice.

Albert · December 2015

You wrote wrong css. The right one should be:

.kuva img.scale-with-grid, .kuva img { width: 100% !important; height: auto !important; }

Next time when you create custom css's, we suggest to look http://themes.muffingroup.com/betheme/documentation/#theme-customizations where we described how to use Firebug for FF properly.

tuomot · December 2015

now its working, thank you so much for helping me !

have a nice day and awesome weekend !

Albert · December 2015

You're welcome and have a nice day as well

100% width to image

Comments