Viewing 12 posts - 1 through 12 (of 12 total)
  • Author
    Posts
  • #524736

    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

    #524967

    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

    #756516

    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,

    #756538

    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 ago by Hokuspokus.
    #757463

    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

    #758084

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

    #758086

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

    thanks again

    #758709

    Hi @pberquet,

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

    Best regards,
    Rikard

    #758786

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

    #759294

    Hi,

    Please try this:

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

    Best regards,
    Rikard

    #760035

    Worked great ! Thanks a lot, Rikard.

    Regards.

    #760454

    Hi,

    Great, glad we could help :-)

    Best regards,
    Rikard

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