Docs

[Polaradventures]

I would like to make the heading responsive / go smaller when viewed on mobile devices. In the attached image you can see that the heading is way too big for smaller devices.

[Polaradventures]

This reply has been marked as private.

[Thai]

Hi There,

Please add the following CSS under Customizer > Custom > Global CSS:

@media (max-width: 767px){
    .page-id-3498 #x-section-1 .h-custom-headline {
        font-size: 22px;
        padding: 15px 10px;
    }
}

Hope it helps 🙂

[Polaradventures]

That worked, thank you =).

I would now like to apply this to all subpages of

http://polaradventures.eu/flugexpeditionen/

and

http://polaradventures.eu/schiffe/

How can I do this?

[Thai]

Hi There,

In this case, please update the previous CSS a bit:

@media (max-width: 767px){
    .my-custom-headline.h-custom-headline {
        font-size: 22px !important;
        padding: 15px 10px !important;
    }
}

Then add the my-custom-headline to the class field of your custom headlines:

http://i.imgur.com/YGEC89y.png

Hope it helps 🙂

[Polaradventures]

Is there a way that I do not have to edit every page individually to put in the “my-custom-headline” class?

I want this to apply to almost 100 pages – it would be really tedious if I had to edit every page individually.

[Thai]

Hi There,

Please try with this:

@media (max-width: 767px){
    .h-custom-headline {
        font-size: 22px !important;
        padding: 15px 10px !important;
    }
}

Hope it helps 🙂

[Polaradventures]

Thanks this worked! =)

[Thai]

If you need anything else please let us know.

[Author]

Posts