Question

I have a real issue with a site I am developing. I had it working, and then was forced to amend the styles – now I cannot get it back to what I need.

Link to the site is here:

http://pegasus.qa.hairylemon.co.nz/

My problem is the cycling banners. They are 1200px wide. The rest of the site is 960 pixels wide. This is a deliberate design and I have to implement this.

The trouble is, the client does not want horizontal scrollbars appearing until the browser is under 960px wide. At the moment, the scrollbars kick in at less than 1200 px.

My solution involved max width – I remember that – but I cannot make it work. Can someone help?

This is a Joomla site – so I have to use the banner plugin. I am using jQuery cycle plugin to go through the various banners output by the banner module. Each banner module is a custom chunk of HTML code – with the image set as a background image so we can shrink the browser.

Will answer any questions needed.

Answer 1

If you use width: 100%; max-width: 1200px; min-width: 960px you can confine the width of the image to within the range you specify. Do not specify anything for the height, and the aspect ratio of the image will be maintained.