New Landing › How can we help? › Cardinal › Mobile font size for headers

Viewing 15 posts - 1 through 15 (of 15 total)
  • Back to forum
    Posted in: Cardinal
  • February 3, 2015 at 2:19 pm #146781
    deejayhart
    Member
    Post count: 239

    Hi there – if you look at the headers and h1 setting on this page, it is too big for mobile. I want to keep it this size for laptop, so is there any way to have a CSS change of size for mobile? I am using Exo Ultralight 100 at 90px. Ta!

    February 3, 2015 at 3:19 pm #146823
    Kyle – SUPPORT
    Moderator
    Post count: 35880

    Hi

    The font size gets smaller when you reduce the screen size

    – Kyle

    February 3, 2015 at 3:28 pm #146833
    deejayhart
    Member
    Post count: 239

    OK – look on iphone. A single word does not fit on a line therefore I need a CSS tweak.

    Also, testimonials quotation still there. As I say, it takes half the time to answer it first, so your consideration much appreciated!

    Ta, Dan

    February 3, 2015 at 3:36 pm #146837
    Kyle – SUPPORT
    Moderator
    Post count: 35880

    Try this:

    .spb-asset-content > h1, .spb-asset-content > h2, .spb-asset-content > h3 {
  font-size: 1em!important;
}

    – Kyle

    February 3, 2015 at 3:41 pm #146842
    deejayhart
    Member
    Post count: 239

    OK – that works for the h1 in ABOUT page, but makes no difference to the header font – nearly there – what else do I need? Ta.

    February 3, 2015 at 3:48 pm #146844
    Kyle – SUPPORT
    Moderator
    Post count: 35880

    Add 

    
@media only screen and (max-width: 767px) { 
.page-heading h1, .page-heading h3 {
  font-size: 1em!important;
}
}

    – Kyle

    February 10, 2015 at 3:15 pm #148792
    deejayhart
    Member
    Post count: 239

    Hi there – I have had to reconstruct all the code as I moved site from a subfolder. What a pain, had no idea I had to back up WP, database *and* the theme options, but hey ho.

    Here is my code (I have removed the mobile reference for now in the live site) – the two outstanding issues are h1 and h2 and headers in mobile (if I include the code below it just shows small on a laptop which is not what I want – the real h1 and h2 are 90 and 40px respectively but this looks crap on mobile. Please look at PACKAGES on iphone too – the text has no padding at all. Thanks very much for your help here – just moving from folder to root has taken me hours of work…

    **

    .testimonials > li:before {
    display: none;
    }
    .testimonials > li {
    padding-left: 0;
    }

    .page-id-73 h1, .page-id-73 h2 , .page-id-73 h3{
    text-shadow: 2px 2px #000000 !important;
    }

    .testimonials > li:before {
    display: none;
    }
    .testimonials > li {
    padding-left: 0;
    }

    .full-center #logo {
    max-width: 100%;
    }

    .spb-asset-content > h1, .spb-asset-content > h2, .spb-asset-content > h3 {
    font-size: 1em!important;
    }

    @media only screen and (max-width: 767px) {
    .page-heading h1, .page-heading h3 {
    font-size: 1em!important;
    }
    }

    .page-id-73 h1, .page-id-73 h2 , .page-id-73 h3{
    text-shadow: 3px 3px #000000 !important;
    }

    February 10, 2015 at 3:29 pm #148800
    Kyle – SUPPORT
    Moderator
    Post count: 35880

    Can you please point our exactly what it is your trying to change?

    – Kyle

    February 10, 2015 at 3:47 pm #148807
    deejayhart
    Member
    Post count: 239

    Look at headers and h1 on an iphone. They are too big therefore I need to shrink them for mobile only. Also look at PACKAGES – looks crap on mobile due to no padding. Please help 😉

    February 10, 2015 at 3:56 pm #148811
    Kyle – SUPPORT
    Moderator
    Post count: 35880

    Try this:

    @media only screen and (max-width: 767px) {
.page-heading h1, .page-heading h3 {
  font-size: 32px!important;
}
}

    Make sure to remove:

    @media only screen and (max-width: 767px) {
.page-heading h1, .page-heading h3 {
font-size: 1em!important;
}
}

    – Kyle

    February 10, 2015 at 4:02 pm #148812
    deejayhart
    Member
    Post count: 239

    Will try later as I am out, unless you can possibly do it? Thinking again, I *only* need to change h1 and the regular HEADERS, not h3.

    Could you also look at PACKAGES and advise on how to improve this on movile please?

    Thanks again. I had it all working yesterday 🙁

    Dan

    February 10, 2015 at 4:04 pm #148813
    deejayhart
    Member
    Post count: 239

    [email protected]
    Artherbrain09

    Soundtwisters.co.uk/wp-admin

    – if you could possibly oblige and put the CSS in! Many thanks.

    February 11, 2015 at 9:57 am #148995
    deejayhart
    Member
    Post count: 239

    Morning, Kyle – possible to address the h1 *and* header thing, along with suggestion on improving packages page? Many thanks.

    February 11, 2015 at 2:07 pm #149080
    deejayhart
    Member
    Post count: 239

    sorted. Please look at the other stuff…

    February 12, 2015 at 3:58 pm #149543
    Rui Guerreiro – SUPPORT
    Keymaster
    Post count: 25779

    Glad it’s sorted.
    -Rui

  • Back to forum
    Posted in: Cardinal
Viewing 15 posts - 1 through 15 (of 15 total)

You must be logged in and have valid license to reply to this topic.

License required for one of the following items
Login and Registration Log in · Register