Remove automatic Height and Width on Images

In this day and age of Responsive Web Design, you need to be careful with inline dimensions for images.

JCE Editor will, by default, add the width and height as inline dimensions for images. This does not translate well with small screens and CSS will not override these inline dimensions.  You may end up with images that are forced to be too wide for the screen on which they are being viewed.

To turn off this automatic dimensioning follow these steps:

Components -> JCE Editor -> Editor Profiles -> Default (or other profile) -> Plugin Parameters -> Image Manager


 Click on the No radio button and select Save at the top.

Once this is turned off, the images will come in at their original size, but will not have a height and width applied to them.

If you want to control their size, you can apply a class to them, then set the width in the stylesheet.  The advantage to this is that you can then reduce that size for the @media calls for responsive styling.

If the original image size is larger than the containing <div> for that article, it will fill the width at 100% and reduce in size proportionately for smaller screen sizes.