Viewing 11 posts - 1 through 11 (of 11 total)
  • Author
    Posts
  • #380346

    Hi there!

    Using Enfold theme and having an issue with the logo and navigation bar overlapping when viewed in browsers on a pc or mobile devices like the ipad. It displays OK on a MAC and in various mac browsers.

    Set the mobile header settings and added some custom css I found in another forum support post, but it’s not making a difference.

    Site address is http://www.openheartcreative.com/.

    Thank you!

    #380351

    Hey dlgould98!

    Please go to Enfold theme options > General Layout > Dimensions and check “Responsive Site”. You are currently using fixed layout

    Regards,
    Yigit

    #380377

    Thank you! I did that yesterday, and cleared cache on my browser but the same issue exists. I just checked it off again, but still same issue with the site display on PCs in both Explorer and Chrome browsers and ipad.

    Looks good on iphone.

    Thank you.

    #380383

    Hey!

    Please add following code to Quick CSS in Enfold theme options under General Styling tab

    @media only screen and (max-width: 1200px) and (min-width: 990px) {
    .av-main-nav > li > a { padding: 0 6px; }
    .logo * { max-width: 84%; top: 5px; }}

    Regards,
    Yigit

    #380435

    That looks better. I’m still having a display issue in the Explorer browser on a PC, but everything else looks good.

    One other issue. On the front page sliders, the text on the second slider image, COLLABORATION is overlapping part of the image. It’s supposed to sit below the hearts. The text on all the other sliders appears fine.

    Thank you!

    #380447

    Hey!

    Please try adding following code to Quick CSS

    @media only screen and (max-width: 1380px) and (min-width: 1260px) {
    .avia-caption-content p {
    font-size: 44px!important;
    }}
    @media only screen and (max-width: 1259px) and (min-width: 1024px) {
    .avia-caption-content p {
    font-size: 32px!important;
    }}

    Best regards,
    Yigit

    #380489

    Thank you that is working. Question… the words on the sliders are now very small in display rather than the size they were originally in relationship to the image, even on the PC and big screen.

    Is there a way to adjust the lettering to be larger but to solve the previous issue.

    Thank you.

    #380655

    Hey!

    Try to adjust the font size values on the css code:

    @media only screen and (max-width: 1380px) and (min-width: 1260px) {
    .avia-caption-content p {
    font-size: 70px!important;
    }}
    @media only screen and (max-width: 1259px) and (min-width: 1024px) {
    .avia-caption-content p {
    font-size: 50px!important;
    }}

    Cheers!
    Ismael

    #382185

    Thank you Ismael!

    We are really good shape except on the iphone display. The font size in relationship to the image looks great on the ipad, but it’s super tiny and out of position on the iphone, even with the font size adjustments.

    Thank you so much.

    #382800

    We have not yet received a reply to our last question posted.

    #383305

    Hey!

    Please add following code to Quick CSS as well

    @media only screen and (max-width: 479px) {
    .responsive #top .slideshow_caption .avia-caption-content {
    font-size: 17px !important;
    top: 27px;
    position: relative;
    }
    .avia-slideshow-dots.avia-slideshow-controls { display: none; }}

    Best regards,
    Yigit

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