Page Header Style

Community Forums Forums General Discussion Page Header Style

This topic is: resolved

This topic contains 11 replies, has 2 voices, and was last updated by  ironjiant 1 year, 5 months ago.

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

    ironjiant
    Participant
    Post count: 43

    I have built a site using the Education Theme here: ConstructionPlus.com

    I have a webfont that is in the h1 tag (the red bar header with the white font”) but the bottom descenders of the font are being cut off in IE 8.

    I have not been able to discover why. I thought it was a style issue in H1 or .entry-title but I cannot find it.

    thanks!

    -Jim

    • This topic was modified 1 year, 5 months ago by  ironjiant.
    • This topic was modified 1 year, 5 months ago by  ironjiant.
    http://www.constructionplus.com
    #46908

    ironjiant
    Participant
    Post count: 43

    http://www.constructionplus.com

    • This reply was modified 1 year, 5 months ago by  ironjiant.
    • This reply was modified 1 year, 5 months ago by  ironjiant.
    #46912

    Debra Scott
    Moderator
    Post count: 132

    I think you may have some part of the css above open somewhere because if you add ‘ to the front of the font family

    font-family: ‘P22FLLWTerracotta-Regular;

    it renders properly in IE8 and Chrome


    need help with your business or personal website? Contact me at Fat Cat Designs

    #46918

    ironjiant
    Participant
    Post count: 43

    Thanks Debra, but unfortunately it is still cutting off the descenders of the header font in IE 8 for PC.
    -Jim

    #46996

    Debra Scott
    Moderator
    Post count: 132

    yes you have added quotes to the front and back. If you take away one of those quotes it works as expected. This as I said previously could be because there is an open quote further up the stylesheet somewhere.


    need help with your business or personal website? Contact me at Fat Cat Designs

    #47025

    ironjiant
    Participant
    Post count: 43

    No luck Debra. Maybe you are seeing the default font instead of the webfont? see image below of what the font should look like (in red box) … but IE8 it is still cutting the descenders off below the baseline.

    <br />
    http://www.constructionplus.com/terracott-font.png

    • This reply was modified 1 year, 5 months ago by  ironjiant.
    • This reply was modified 1 year, 5 months ago by  ironjiant.
    • This reply was modified 1 year, 5 months ago by  ironjiant.
    • This reply was modified 1 year, 5 months ago by  ironjiant.
    #47029

    Debra Scott
    Moderator
    Post count: 132

    yes that is what I was seeing also. Just an idea. What about styling the default style with what you want and eliminating the style from the green and see if that works.


    need help with your business or personal website? Contact me at Fat Cat Designs

    • This reply was modified 1 year, 5 months ago by  Debra Scott.
    • This reply was modified 1 year, 5 months ago by  Debra Scott.
    #47037

    ironjiant
    Participant
    Post count: 43

    Thank you for your patience. Please see screenshot below. This is how this font is showing up in IE 8.0.6 regardless where the quotes are placed.

    http://www.constructionplus.com/font-on-pc.jpg

    • This reply was modified 1 year, 5 months ago by  ironjiant.
    • This reply was modified 1 year, 5 months ago by  ironjiant.
    #47040

    ironjiant
    Participant
    Post count: 43

    I’ve turned Caching plugins off and cache cleared to confirm.

    #47042

    Debra Scott
    Moderator
    Post count: 132

    did you try this?

    What about styling the default style with what you want and eliminating the style from the green and see if that works.


    need help with your business or personal website? Contact me at Fat Cat Designs

    #47048

    Debra Scott
    Moderator
    Post count: 132

    this is out of left field but since you have your font set up as a class try this

    .education-green h1.P22FLLWTerracotta-Regular {

    }
    .education-green h1{

    font-weight: bold;
    font-style: normal;
    font-size:44px;
    margin: 0 0 10px;
    background: #98002f;
    border: 1px solid #ccc;
    padding: 0px 105px 20px 2px;
    margin:-20px;
    padding-top: 0px;
    padding-left: 15px;
    padding-bottom: 20px;
    border-left-width: 0px;
    border-top-width: 0px;
    color: #fff;
    }


    need help with your business or personal website? Contact me at Fat Cat Designs

    #47055

    ironjiant
    Participant
    Post count: 43

    I will try that, thanks. I’ll clean up that mess of margins and padding I’ve got there as well :-)
    -Jim

Viewing 12 posts - 1 through 12 (of 12 total)

You must be logged in to reply to this topic.