Viewing 5 posts - 1 through 5 (of 5 total)
  • Author
    Posts
  • #189097

    I’m testing custom styling the theme and I found a strage behavior, I added a font pack to my child theme and code to the custom.css
    CODE:

    @font-face {
    	font-family: 'BebasNeue';
    	src: url('./fonts/BebasNeue-webfont.eot');
    	src: local('☺'), url('./fonts/BebasNeue-webfont.woff') format('woff'), url('./fonts/BebasNeue-webfont.ttf') format('truetype'), url('./fonts/BebasNeue-webfont.svg#webfontQvsv8Mp8') format('svg');
    	font-weight: normal;
    	font-style: normal;
    }
    h1, h2, h3, h4, h5, h6
    {
    	color: #555;
    	text-transform: uppercase;
    	font-family: BebasNeue, Arial,Verdana,sans-serif;
    	letter-spacing: 0px;
    	font-size: 180%;
    }

    The font is loaded, but the size is a bit strange, all the headings apply the font, but not the resize, so, I have icon boxes with a small font, if you apply letter spacing, icon boxes don’t apply the change,

    Also inside text blocks, h2 is smaller than h4, isn’t it strange, I have not made any more customizations.

    If you change the letter spacing to 10 this happens:

    I also checked this and basically I did the same, no?
    https://kriesi.at/support/topic/add-a-custom-non-google-webfont/

    How can I use the fontface pack?

    How can I increase the h3 font in the icon box, that doesn’t like my custom code to increase the font size on .iconbox_content_title

    Thanks

    • This topic was modified 11 years, 1 month ago by myuption.
    #189469

    Hi,

    Can you post the link to your website please?

    Regards,
    Josue

    #189507

    I have it running on xampp :(

    No idea Josue, thanks!

    #189537

    Hey!

    Please add something like this on style.css:

    @font-face {
    	font-family: 'BebasNeue';
    	src: url(../fonts/BebasNeue.otf);
    	font-weight: bold;
    	font-style: normal;
    }
    
    .iconbox .iconbox_content .iconbox_content_title {
    letter-spacing: 0px;
    text-transform: uppercase;
    font-size: 20px;
    font-family: 'BebasNeue', sans-serif;
    }

    Make sure that the BebasNeue.otf file is located on a folder called fonts.

    Cheers!
    Ismael

    #189633

    Thanks Ismael, that helped me and now I figured out how to change more headings.

Viewing 5 posts - 1 through 5 (of 5 total)
  • The topic ‘[Resolved] Fontface acting funny’ is closed to new replies.