Tagged: 

Viewing 4 posts - 1 through 4 (of 4 total)
  • Author
    Posts
  • June 16, 2015 at 5:36 pm #460207
    msbllc

    Hi Team,

    Ran into another mobile issue. This time with the LayerSlider. I’m trying to get the logo to be 100% width when responsive (which it is when you flip your device between landscape and portrait). However, when you first pull up the page it appears to be smaller and aligned right.

    Here is a screenshot of two side-by-side comparisons. I’ve jotted some notes in red.
    http://maxcontests.com/wp-content/uploads/2015/06/IMG_3606.png

    Here is the code I am using:

    @media only screen
    and (min-device-width: 375px)
    and (max-device-width: 667px)
    and (-webkit-min-device-pixel-ratio: 2) {
    .madowmobilelogo {
    width: 100% !important;
    }
    }

    The website I’m working on is tbse.maximizedigital.com

    June 17, 2015 at 1:00 pm #460694
    Ismael

    Hey msbllc!

    Thank you for using Enfold,

    Please try this in the Quick CSS field:

    @media only screen and (max-width: 767px) {
.ls-slide > .ls-bg + .ls-gpuhack + a {
  width: 100% !important;
  left: 0 !important;
}}

    Remove browser cache then reload the page.

    Best regards,
    Ismael

    June 17, 2015 at 4:36 pm #460865
    msbllc

    DUDE!! That seems to work perfectly. Thank you. I’ve never seen that style of css of before… using > and + I’m not a css expert by any means. Is that something new that just came out or has it always been around…just a little more advanced?

    June 18, 2015 at 7:13 am #461124
    Rikard

    Hi!

    They were introduced with CSS2 I believe: http://www.w3schools.com/cssref/css_selectors.asp

    Cheers!
    Rikard

  • Author
    Posts
Viewing 4 posts - 1 through 4 (of 4 total)
  • You must be logged in to reply to this topic.