the art theme – mobile header

Home Forums All Other Themes the art theme – mobile header

Viewing 12 posts - 1 through 12 (of 12 total)
  • Author
    Posts
  • #59975
    Courtney ClineCourtney Cline
    Participant
    • Topics: 32
    • Replies: 62
    • Total: 94
    Member since: January 10, 2017

    can you please help me change the color of the mobile header? it is currently displaying black, which does not allow my logo to be seen.

    i tried this code:
    @media screen and (max-width:767px) {
    .home .header {
    background-color: rgba(244,243,243) !important;
    }
    }

    but, clearly, i’m doing something wrong.

    thanks!

    #60015
    Courtney ClineCourtney Cline
    Participant
    • Topics: 32
    • Replies: 62
    • Total: 94
    Member since: January 10, 2017

    two other things have come up with this theme now…

    one – the slider isn’t working correctly on a mobile device. the slant of the image shows up for a split second and then flashes into a straight line. not only does it look like a glitch, it covers up the top part of the next section’s heading. please help.

    two – the testimonial font when viewing it on a mobile device seems unnecessarily large. how can i adjust it just for the mobile view?

    my website is https://www.designbycline.com

    thanks!

    #60016
    Courtney ClineCourtney Cline
    Participant
    • Topics: 32
    • Replies: 62
    • Total: 94
    Member since: January 10, 2017

    i solved the very first problem with

    @media screen and (max-width:767px) {
    .home.has_trans_header .header {
    background: #f4f3f3 !important;
    }
    }

    #60017
    Courtney ClineCourtney Cline
    Participant
    • Topics: 32
    • Replies: 62
    • Total: 94
    Member since: January 10, 2017

    okay – i also told it to display none for the slider @media screen and (max-width:767px)

    so the only thing i haven’t been able to figure out is the testimonial text size on the mobile device. can you please help with that?

    #60018
    Courtney ClineCourtney Cline
    Participant
    • Topics: 32
    • Replies: 62
    • Total: 94
    Member since: January 10, 2017

    well, i guess hiding the slider wasn’t the solution I was looking for because it’s still not carrying over the angle at the bottom of the header, so it’s still covering up the top part of the next section’s heading…but at least it’s not glitching. what’s weird is that if shrink my browser on my computer to mobile size the slider/header issue does not exist. it’s only when i view it on my iphone. do you think it’s browser related, because i have to use safari as my browser on my phone rather than mozilla?

    sorry for all the messages

    #60114
    Sonnal S SinhaSonnal S Sinha
    Moderator
    • Topics: 0
    • Replies: 30587
    • Total: 30587
    Member since: August 16, 2013

    Hi Courtney,

    Can you send us screenshots? Upload your screenshot on imgur.com and paste the share URL here.

    Regards,
    Dave

    #60213
    Courtney ClineCourtney Cline
    Participant
    • Topics: 32
    • Replies: 62
    • Total: 94
    Member since: January 10, 2017

    here you can see the header line i’m talking about. when it’s straight, instead of slanted, on a mobile device, it cuts off part of the next section’s header.

    http://imgur.com/a/BajbL

    #60376
    Sonnal S SinhaSonnal S Sinha
    Keymaster
    • Topics: 10
    • Replies: 6964
    • Total: 6974
    Member since: June 12, 2013

    Hi,

    Kindly go to Appearance>>Customize>>Scroll down to find Custom CSS and paste there:

    .footercols4, .footercols3, .footercols2, .footercols1 { box-sizing:border-box;}

    Regards,
    Shri

    #60401
    Courtney ClineCourtney Cline
    Participant
    • Topics: 32
    • Replies: 62
    • Total: 94
    Member since: January 10, 2017

    was this suppose to fix my header problem on mobile devices? it did not.

    #60914
    Courtney ClineCourtney Cline
    Participant
    • Topics: 32
    • Replies: 62
    • Total: 94
    Member since: January 10, 2017

    do you have a solution for my header issue yet? it’s still displaying as shown in the screenshots included previously.

    #61001
    Sonnal S SinhaSonnal S Sinha
    Moderator
    • Topics: 0
    • Replies: 30587
    • Total: 30587
    Member since: August 16, 2013

    Hi

    Kindly go to Appearance>Customize>Scroll down to left bottom to find Custom CSS

    and paste there:

    @media screen and (max-width:479px) {
    .head-info-area .left, .head-info-area .right { text-align:center;}
    .head-info-area a { display:block; margin-left:0; text-align:center;}
    }

    Regards,
    Dave

    #61053
    Courtney ClineCourtney Cline
    Participant
    • Topics: 32
    • Replies: 62
    • Total: 94
    Member since: January 10, 2017

    that didn’t fix it either. i couldn’t ever get the slant to appear like it should, but i did finally get the Services title to stop being cut off by the header by adding

    @media screen and (max-width:479px) {
    .logo img {
    margin-bottom: 0px;}
    .featured_area {
    padding: 80px 0;}
    }

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