Hot Image Slider overlapping blog articles

Hi there,

I have just downloaded and installed Hot Image Slider and it looks like the functionality should work very well. I have Joomla! 2.5.6 installed with the default Beez_20 template in use on the test site: www.quartertonclass.org/new/

I've enabled the slider on the home page only but unfortunately it overlaps the articles (category blog). I have set it to position-12 (top of #wrapper2) on the Beez_20 template and had hoped the articles would automatically be moved down to accommodate the slider size and height. I only have three test pics up, but would eventually replace them with more panoramic shots (wider and not as high) when working.

As suggested on other topics on this forum, I have tried editing template.css (templates/beez_20/css) and style.css (modules/mod_hot_image_slider/tmpl) to move the absolute position of the slider OK, but the articles beneath remain covered.

Note: Naturally on the other pages where the slider isn't active, I'd like the articles to be at the top of the page as they don't need to make room for the slider height.

I'd greatly appreciate any pointers someone can give!!

Many thanks in advance.

Cheers,
Snax

add this somewhere in your css:

div#top {
height:312px!important;
}

Hi Ivan,

Thanks very much for taking the time to reply. I'll look up that code and let you know how I get on.

Many thanks again.

Cheers,
Dave

Hi Ivan, that code worked absolutely perfectly. Thank you so much!

Note: I added your code to css/position.css in the beez_20 template. i.e. Under Extensions -> Template Manager -> Beez_20 (template column) -> Edit css/position.css (Stylesheets)