This forum is no longer open and is for reading/searching only.

Please use our new MachForm Community Forum instead.

MachForm Community Forums » MachForm 3

Font via advanced CSS not working


  1. SMHTech
    Member

    Like many comentors I was unwilling to find my prefered google font in a 'pick list' so utilised the advanced css as below...

    h1, h2, h3, h4, h5, h6 {
    font-family: 'Audiowide' !important;
    }

    I had to add the important tag as it was not overwriding the default CSS even though it was added to the style sheet ok!

    HOWEVER, it is still not displaying the correct font in the form heading. Other headings on the page are OK so the link href (below) is working in the <head> OK.

    <link href='http://fonts.googleapis.com/css?family=Audiowide' rel='stylesheet' type='text/css'>

    Do I need to add this link in machform as well and if so where?

    Have screen shot but can't see anywhere to add it, so page is here > http://www.bluestreak-airsoft.co.uk/contact_us.php

    Posted 10 years ago #
  2. Saghalie
    Pro Member

    look for your css file for the form stylesheet (public_html/machform/data/form_####/css/style.css) - whatever your path is...

    You can also add styles in your heading text when editing the form. In the "Field Label" area just add the style you want using normal HTML.

    e.g.
    <p style="font-size: 10px; margin-top: 20px;">Contact us</p>

    Hope this helps.

    Regards,

    Saghalie
    http://www.kcmhosting.com

    Posted 10 years ago #
  3. SMHTech
    Member

    Thanks, didn't know you could use html in the forms, I'll try that as I'm sure it's not the CSS as the correct line is there when I inspect with firebug so it's justnot pulling the font from google?

    Posted 10 years ago #
  4. SMHTech
    Member

    Worked a treat, put the <link href.....> to the google service in the form field (is in page header anyway?) and it's worked! Still don't get why it did not work with the header link anyway ???

    Posted 10 years ago #
  5. Saghalie
    Pro Member

    I believe it is because in the CSS it will use the !important tag and that overrides anything else. So when the page loads, CSS is loaded first but after it loads it goes away and you are able to override the !important tag.

    Just a guess on my part. Others here might know more than I....

    Regards,

    Saghalie
    http://www.kcmhosting.com

    Posted 10 years ago #

RSS feed for this topic

Reply