Viewing 4 posts - 1 through 4 (of 4 total)
  • Author
    Posts
  • June 12, 2020 at 12:25 am #1221915
    ellamac

    Hello Support,
    I’m having some trouble with changing the font size of a text block for mobile only.
    The font size option in the text block (Font Size for very small screens (smaller than 479px – eg: Smartphone Portrait)) does not seem to be working for me.
    I’ve tried quite a few options in the forum including the following Custom CSS Class;

    @media only screen and (max-width: 767px) {
    .availtext .avia_textblock {
    font-size: 12px !important;
    text-align: center;
    padding-left: 10px;
    padding-right: 10px;
    }
    }

    What I’m trying to achieve is for the text ‘Next Availability: 18 June 2020’ to be displayed on a single line above the button on the mobile view only.
    Any help would be greatly appreciated!
    Many thansks.

    June 13, 2020 at 6:49 am #1222305
    Jordan Shannon

    Hey Suze,

    Did you clear your cache on the mobile device?

    Best regards,
    Jordan Shannon

    June 15, 2020 at 5:11 am #1222547
    ellamac

    Yes. Are you receiving a different result then?

    • This reply was modified 4 years, 4 months ago by ellamac.
    June 15, 2020 at 4:33 pm #1222721
    Victoria

    Hi ellamac,

    Here is the code you can put in Enfold > General Styling > Quick Css,  if it does not work, put into themes/enfold/css/custom.css

    
@media only screen and (max-width: 767px) {
	.availtext.avia_textblock h3 {
		font-size: 12px !important;
		text-align: center;
		padding-left: 10px;
		padding-right: 10px;
		}
	}

    If you need further assistance please let us know.

    Best regards,
    Victoria

    • This reply was modified 4 years, 4 months ago by Victoria.
  • Author
    Posts
Viewing 4 posts - 1 through 4 (of 4 total)
  • You must be logged in to reply to this topic.