Viewing 12 posts - 1 through 12 (of 12 total)
  • Author
    Posts
  • October 26, 2015 at 9:13 am #524736
    exmx

    Hello,
    I just founded a problem in my website
    http://www.igp-textiles.ch/

    i have 3 blocs
    MÉDICAL & SANTÉ
    HÔTELLERIE & RESTAURATION
    …

    On a mobile this title is in H2, and i configure in back end H2 = 50 pix but in mobile the title of second and 3rd bloc is too long and in this case the responsive is not working

    So how can the font size can be reduce only on mobile ?

    thanks

    October 26, 2015 at 3:57 pm #524967
    Yigit

    Hi exmx!

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

    @media only screen and (max-width: 480px) {
h2.av-special-heading-tag {
    font-size: 30px!important;
}}

    Cheers!
    Yigit

    March 6, 2017 at 5:40 pm #756516
    pberquet

    Hi,

    I have a text block with H2 text in it. It does not fit on mobile.
    Then created a class for this specific text block named: “header-planifiez”
    I tried to add this code to quick CSS:

    @media only screen and (max-width: 767px) {
    .header-planifiez { font-size:30px!important; }}

    It did not work. I have also tried this one but with no results :

    @media only screen and (max-width: 767px) {
    .header-planifiez h2 { font-size:30px!important; }}

    When I try modifying other stuff, such as width, it works but only the font-size doesn’t.
    Do you know what I am doing wrong?

    Regards,

    March 6, 2017 at 6:22 pm #756538
    Hokuspokus

    Hi, Same problems. This is not the sense of “Responsive”, lovely Enfold Guys. Responsive means: On every device it’s a pretty look.
    There are more stuff, which is not responsive. If you have more than 8 signs, it’s too difficult for Enfold to implement a rule. It’s better for enfold to answer again and again. I wan’t know, how many user make a responsive test on different devices. I think, most of them use one device and if it this o.k, than is it ok. And with the new ugly tab section, it’s the same stuff. i create a task.

    @media only screen and (max-width: 1310px) {
    .avia_iconbox_title {
    font-size: 16px !Important;
    }
    .avia-button-fullwidth {
    !padding: 1%;
    !margin: 1%;
    }}

    @media only screen and (max-width: 1050px) {
    .avia_iconbox_title {
    font-size: 14px !Important;
    }
    .responsive #top #wrap_all .container {
    padding-left: 5px;
    }
    h1 {
    font-size:18px;
    }
    h2 {
    font-size:16px;
    }
    h3 {
    font-size:14px;
    }}

    • This reply was modified 7 years, 9 months ago by Hokuspokus.
    March 8, 2017 at 4:55 am #757463
    Rikard

    Hi @seolotsen,

    Thanks for the explanation, we’ll take a note of it. I’m not sure if you have a specific problem though? If you do then please try to explain it a bit further. Also, what is CSS like this supposed to do?

    .avia-button-fullwidth {
!padding: 1%;
!margin: 1%;
}

    Best regards,
    Rikard

    March 8, 2017 at 11:30 pm #758084
    Hokuspokus

    Oh, excuse me, it’s additional from me. Copy paste error.

    March 8, 2017 at 11:32 pm #758086
    pberquet

    Hi,
    I’m still having this problem though :)

    thanks again

    March 10, 2017 at 7:18 am #758709
    Rikard

    Hi @pberquet,

    Would be great if you could link to where we can see your problem.

    Best regards,
    Rikard

    March 10, 2017 at 10:22 am #758786
    pberquet

    Here is the link to the page where I am having some problems

    March 11, 2017 at 7:28 am #759294
    Rikard

    Hi,

    Please try this:

    .header-planifiez h2 span {
  font-size:30px !important;
}

    Best regards,
    Rikard

    March 13, 2017 at 2:55 pm #760035
    pberquet

    Worked great ! Thanks a lot, Rikard.

    Regards.

    March 14, 2017 at 6:41 am #760454
    Rikard

    Hi,

    Great, glad we could help :-)

    Best regards,
    Rikard

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