What CSS do I need to fix to make a slider plugin I downloaded responsive?

[iizag]

What CSS do I need to fix to make a slider plugin I downloaded responsive?

The slider can be seen on the following page, the third block called “Our Values”, : http://iamdentistry.com/timeline/

If you shrink the size of your browser window you will see how in the first slide the paragraph gets cut off and the overflow is not displayed. And I have already tried turning overflows to visible !important ( which work on firebug) but dont take affect when i put it into my css file. So I am not sure how to fix this?

Thank you for any help

[Paulie_D]

I looks pretty responsive to me.

I suspect the issue arises because where the ‘headings’ are/become multiline they force the paragraph down.

Since that section has a fixed height of 200px (probably in the JS as it’s inline code) it disappears to to the overflow being hidden.

<div class="slideshow_content" style="width: 513px; height: 200px;">

You might want to change the font-size in your media query(ies).

Of course, that might be problematical since the text is a bare text node instead of inside a proper text tag

<div class="slideshow_title" style="color: #e9f3da;">
When the Community Succeeds, We Succeed
</div>

[Paulie_D]

So the only fix then is a shorter paragraph block mixed with a shorter title ?

No…changing the font size in a media query would be the simplest answer.

I didn’t say it couldn’t be done, just that it’s made harder by the fact that the HTML is…erm…not exactly ‘regular’.

[Author]

Posts