Layout issue with RevSlider

Tagged: ,

Viewing 11 posts - 1 through 11 (of 11 total)
  • Author
    Posts
  • #5433
    Colibriinteractivecolibriinteractive
    Participant

    Hello, I’ve already send an support request via email on 19 Feb but haven’t received an answer jet. So here’s the question again:

    I have an issue with the slider on the page: http://adsquare.com

    The four lines of text on the slider are positioned 50px from the left on the x axis. But even when I set them to 0 pixels from left they do not align left with the logo.
    Any ideas how to fix that?

    Secondly, is there a way to set them aligned with the logo (0 pixels from left) but have then not “sticked to the left screen border” on smartphones? That’s the only reason I use the 50px currently, but it’s ugly on desktop devices.

    Thanks,
    Felix

    #5451
    ErnestoErnesto
    Member

    Hi,
    Go to your Custom CSS Section in your Theme Options Panel and enter the following code:
    .tp-caption {position: absolute!important; left: 0px !important}
    Let me know if that works, so we can star working on the second issue since they are related.

    #5756
    Colibriinteractivecolibriinteractive
    Participant

    Hi,

    that kind of worked. The position absolute gets overwritten by the .tp-simpleresponsive .caption, .tp-simpleresponsive .tp-caption which adds an position: absolute to the element already.

    The left: 0 works but puts the headlines to the border of the browser. I reckon we need to “redefine” the frame where the headlines are positioned in?
    What’s the second step you mentioned?

    FYI: I added the css just via the Safari WebInspector to check them out as the page is in live mode.
    When we got a version via WebInspector that works I add them to the custom css file.

    Thanks in advance
    Felix

    #5760
    ErnestoErnesto
    Member

    Hi, what we wanted to now before aligning the text with the logo was the response in the page. To have aligned with the logo you’ll need to set it left:230px!important

    Hope that works, let us know if there’s any problem!

    #5788
    Colibriinteractivecolibriinteractive
    Participant

    This works only with the right size of the browser window. But in most cases it’s mispositioned.
    I think, we need a position relative on the parent element.

    Please have a look at the page http://adsquare.com and send me some css code that I can copy & past which will align the headlines of the slides always level with the logo no matter what screenwidth/browserwidth/device I use.

    Thanks!
    Felix

    #5848
    NexusNexus
    Moderator

    See whether these steps helps:

    Navigate to the Revolution Slider that you have created and click on the “Settings”.

    In the “Grid settings” set the grid width to 1140 pixels (Right now I think you have it as 960 pixels)

    If this doesn’t help please reply here as a private message with a login to your dashboard and I can take a look. Thanks!

    #5849
    NexusNexus
    Moderator

    And also remove any css that you have put in custom css regarding this issue.

    #5909
    Colibriinteractivecolibriinteractive
    Participant

    Hi,

    the change of the grid size to 1140 works good for the positioning of the headlines and the desktop version but on the mobile version (probably everything smaller 1140px) the headlines are sticking right at the left screen border now.

    http://www.adsquare.com

    How can I adjust that?

    Thanks
    Felix

    P.S.: I’m unfortunately not allowed to grand backend access to other people. But if you tell me what settings you want to see I can send you screenshots of the current settings.

    #5955
    NexusNexus
    Moderator

    I see that you have setup the second and third slide properly and works fine even in the mobile resolution. The problem is only with the first slide. So just replicate the settings from the second slide to the first slide.

    #5958
    Colibriinteractivecolibriinteractive
    Participant

    Unfortunately not. The first slide is positioned 0 for the horizontal x-axis but is is too far left of the logo on desktop browsers and sticky to the border of the screen on mobil devices.

    The headline of the second and third slides are to far left on desktop browsers but look better on mobile devices.

    This is do demonstrate you the pitfall…

    How can I tell this rev slider to position the headlines horizontally at position 0 for desktop and 50 for all other devices???
    I thought this is a premium theme/3rd party slider plug-in but constantly working on the slider sucks…

    Thanks for your assistance
    Felix

    #5982
    NexusNexus
    Moderator
    This reply has been marked as private.
Viewing 11 posts - 1 through 11 (of 11 total)
  • The forum ‘Appdev Theme Support’ is closed to new topics and replies.