Pictures auto sizing?

unclegusy2k

Hey there!

Im hoping someone can help me, everytime i i put a link to a picture i.e img scr= ...... and even when i try and set the size of it for some reason the width keeps on matching the width of my post so is always stretched? is there some where i need to change to get this to stop happening?

sorry if i havent explained this right but im trying to get used to this.

thanks in advance

hgtonight

Welcome to the community!

What version of Vanilla are you running?

What theme are you using?

The issues you describe are most likely due to JS resizing. It is also possibly a CSS issue, but I would guess it is JS related.

unclegusy2k

Version 2.0.18.8

Vanilla Theme by VrijVlinder

unclegusy2k

any ideas as to which one it might be in?

hgtonight

I am calling on the V-Doc!

@vrijvlinder do you know what is happening?

x00

if this just the width that is set it should scale proportionally, which isn't what appearers to be happening in that pic.

peregrine

Two suggestions,

1) does it work properly with default theme.
2) post your question under the theme in question - if only occurs with that theme. It makes it easier for others to find solution if there is one, later

vrijvlinder

Hi sorry I was not here, well I was but was sleeping... As far as images go adding an image to the post will make it the size of the width of the content. That was not from the theme making it that way, it is possible that I may have made it smaller so it fit in the content box,

I have about 12 themes, so it could help if you could tell me which one it is. And a link to the installation.

If you want to make the images smaller, you would need to add this code or edit it if it is there.

.Message img{max-width:200px;height:auto;}

unclegusy2k

hi there and thanks for everyones reply, sorry ive been in work.

the theme im using is GreenGlassversion 1.1

link to the installation is here

even if i try to size the img by using <img height="400" width="400" img src="http://..... it still only does the height and not the width, maybe my code is wrong as i am still only learning but i really do appreciate everyone's help

im off to bed now so will reply in the morning (uk time)

vrijvlinder

Yes, ok go to line 907 of the custom.css file of the theme and change to this, which should give you the actual size of the image. If the image is smaller it will be the width of the image. If you want to make the images smaller than the full width of the image change the values to digits instead of percentage for the width. The reason for using percentages in the width is so the image can adjust to the size of the browser window .

.Message img {
-moz-box-shadow:2px 2px 3px rgba(0,0,0,0.5);
-webkit-box-shadow:2px 2px 3px rgba(0,0,0,0.5);
border:1px solid #222;
border-radius:10px;
box-shadow:2px 2px 3px rgba(0,0,0,0.5);
max-width:98%!important;
height:auto!important;
}

even if i try to size the img by using <img height="400" width="400" it still only does the height and not the width,

The style from the custom.css supersedes the style input from the embedded image. You would have to use a style="width etc...." tag in the image code and add !important to make it do it. However if there is an !important in the custom.css it will override anything except a plugin.

adding the height as I did above to that block of code should give you the proportional size.

I remember why I had to add that code, the resize js from vanilla was not responding well to the flexible theme. It would resize bigger and sometimes it would take a refresh to make it resize so would have huge pictures overflowing the content.

That code fixes it because it overrides the resize functions...

unclegusy2k

Thats the one! its great when you know what your looking for

thank you everyone for your help and fast responces

vrijvlinder

You are very Welcome ! Thanks for using my theme