This thread is over two years old and may be outdated. Please create a new thread if you need help, or email us if you have an active Premium license.

Flex Slider arrows on mobile

11 years ago · Last reply by Andrew Misplon 11 years ago

Hiya,
Here’s a screenshot from my iPhone (looks the same on ipad, too)
http://screencast.com/t/fFEGH0nfHJ

If I click on my slider on ipad or iphone, the black arrows come up but are sized all wonky. How can I fix this? Or choose to not show arrows on mobile?

Also, I had to adjust the mobile resolution to 780px cause I couldn’t figure out how else to get my header from looking weird on ipad:
http://screencast.com/t/LpsHvwEj
this is what it looked like before I made the change:
http://screencast.com/t/6iI5UxTTXj

Is there a better way to do this? Does this have anything to do with the arrows showing up?

Thanks again for all the help! Am loving this theme, just have these little tweaks to make before I can populate my pages and go live!

URL: http://caritaylor.com

This is our free support forum. Replies can take several days.

Need fast email support? Get SiteOrigin Premium

Replies

3
  1. Andrew Misplon Staff 11 years, 1 month ago

    Hi wiredpoet

    Apologies for the hassle. This is a Retina issue. We have it fixed in Vantage 2.2.4. That update is going through some internal testing at the moment, we’ll push it live as soon as possible.

    You’ve done the right thing to resolve the header cross over. You just need to grab that entire block and put it in Custom CSS:

    /* Vantage Header Responsive Breakpoint */
    @media (max-width: 960px) {
      body.responsive header#masthead .hgroup {
        text-align: center;
      }
      body.responsive header#masthead .hgroup .logo {
        float: none;
      }
      body.responsive header#masthead .hgroup .logo img {
        margin: 0 auto;
        padding-top: 0px !important;
        padding-bottom: 0px !important;
      }
      body.responsive header#masthead .hgroup .support-text,
      body.responsive header#masthead .hgroup #header-sidebar {
        position: static;
        display: block;
        margin-top: 30px;
        max-width: 100%;
      }
      body.responsive header#masthead .hgroup .support-text img,
      body.responsive header#masthead .hgroup #header-sidebar img {
        max-width: 100%;
        height: auto;
      }
      body.responsive header#masthead .hgroup #header-sidebar {
        padding-top: 0 !important;
        padding-bottom: 0 !important;
        height: auto;
      }
      body.responsive header#masthead .hgroup #header-sidebar .widget {
        display: block;
        margin: 0 auto;
        float: none;
      }
    }
  2. wiredpoet 11 years, 1 month ago

    The code above doesn’t match the code I have in my css file–should I leave the code in the theme css alone and then just use what you’ve put above in the custom css?

    Thanks ;)
    C

  3. Andrew Misplon Staff 11 years, 30 days ago

    Sure, give what I sent a try in Custom CSS.

Replies on this thread are closed.

Please create a new thread if you have a question, or purchase a SiteOrigin Premium license if you need one-on-one email support.

Have a different question or issue?

Start New Thread