My images aren't reducing in size along with the container or <div> size.

Be sure that you don't set width and height on your images when you place them in articles or modules.

If you use JCE Editor, you can turn off automatic width and height settings by following these steps.

  1. Components -> JCE Editor -> Editor Profiles
  2. Click on Default (or whatever Profile you want to change)
  3. Click on the Plugin Parameters tab
  4. In the left column, click on Image Manager
  5. Click on the No Radio button next to Always Include Dimensions
  6. Select Save

The next time you inserted an image, the editor should not automatically assign a fixed a width and height.

If you have already inserted images before taking these steps, do the following:

  1. Take the steps listed above
  2. Select the image within the article or module by clicking on it
  3. While it is highlighted, select the Image Icon in the task bar image-manager-icon
  4. Take out the width and height dimensions OR go into the html by selecting [Toggle Editor] and take them out manually.
  5. Save the module or article

If these steps aren't working, perhaps your CSS is setting a width or height for the image.

It is best to size the image to the dimensions that you want it to show on a full size monitor with Photoshop or some other program BEFORE uploading.  Forcing height and width on an image is not good practice for a responsive layout. If you can't do that, then you can set the width and or height with CSS, but use percentages so that the responsive styling works properly.


Has BJ.Zemplate.com helped you with understanding Joomla?

If you would like to make a small contribution to help fund this resource, that would be great, but do not feel obligated in any way.

Donation Amounts


Still not finding a special topic?

Use Google's Search function below for search the content of bj.zemplate.com.