rsOverflow width not decreasing responsively but does increase

gavin.murphy's Avatar

gavin.murphy

21 Sep, 2017 11:36 PM

Hi,
We have been asked to fix the royalslider carousel on this site - mfat.govt.nz
When the user reduces the window size the slider does not reduce in width breaking the responsive layout.
If the user increases the window size, the slider does scale up as expected.
Image scaling options are set as desired (as they want fixed height at different device / breakpoints) and the fill method is desired as the images are decorative they say.
So the question is, why does rsOverflow correctly update its width when window size is increased, but doesn't when decreased?
Thanks in advance for any help.

  1. Support Staff 1 Posted by Dmitry Semenov on 22 Sep, 2017 04:43 AM

    Dmitry Semenov's Avatar

    Hello,

    You're using old table layout on a few of slider parent elements. It doesn't shrink because table cell doesn't contract after its block-level content is expanded.

    You'll need either to:

    • Calculate and apply width in pixels to root element of slider via JS (in window.resize event). Set width based on some other element or window itself.
    • Or don't use table CSS properties for page layout (display:table, display:table-cell ...).

    Dmitry

  2. 2 Posted by gavin.murphy on 22 Sep, 2017 04:49 AM

    gavin.murphy's Avatar

    Thanks, Dmitry - much appreciated.

    I look into both options.

    Thanks again

    <deviate>
    making things different

    developing web sites and web applications for devices big and small

    gavin murphy
    director

    deviate.net.nz
    04 381 6842
    0210 774 221

    Level 4
    58 Victoria Street
    Wellington 6011

    PO Box 11169
    2 Manners Street
    Wellington 6011

    *Important: If you have received this message in error please notify the
    sender immediately and then delete this message along with any attachments.
    Please treat the content of this message as private and confidential.*

  3. gavin.murphy closed this discussion on 22 Sep, 2017 05:12 AM.

Comments are currently closed for this discussion. You can start a new one.

Keyboard shortcuts

Generic

? Show this help
ESC Blurs the current field

Comment Form

r Focus the comment reply box
^ + ↩ Submit the comment

You can use Command ⌘ instead of Control ^ on Mac