12 Replies Latest reply on Jun 6, 2013 3:43 AM by MurraySummers

    Explorer ignores font-weight:bold

    Lulù85

      Hello,

      I can't solve this problem: when I set font-weight: bold on my CSS to ul#nav li#home a, Internet Explorer doesn't show me the bold style, while Firefox does.

       

      Thanks!

      Daniela

        • 1. Re: Explorer ignores font-weight:bold
          MurraySummers Level 8

          Let's see the page, please.

          • 3. Re: Explorer ignores font-weight:bold
            MurraySummers Level 8

            That's no help. What would be useful would be for you to upload the page to some webspace you control, and then post a link to that page here. Failing that, copy the entire code of the page and paste it into a reply here. Pasted images are not so useful.

            • 4. Re: Explorer ignores font-weight:bold
              Cozmicone Level 4

              My guess would be that you're trying to replicate the code you're seeing along the bottom of the screenshot you posted. If you have the CSS set to ul#nav as a selector then technically the bolding shouldn't work regardless of where you view it.

               

              Since you've already specified a header div, then to bold all the elements in the unordered list you would just need a css selector set to:

               

              #header,ul {

                  font-weight: bold;

              }

               

              Your screenshot shows that the selector you have built for this text is #nav #home a which would technically work but it's more code than you need for it. If you're only wanting the text to be bold when hovering over the text you need to add the a:hover pseudo class to the css:

               

              #header,ul a:hover {

                  font-weight: bold;

              }

              • 5. Re: Explorer ignores font-weight:bold
                Lulù85 Level 1

                }
                #nav {
                    width: 809px;
                    position: relative;
                    top: 55px;
                    right: 0px;
                    left: 0px;
                    text-align: right;
                }
                #nav li {
                    display: inline;
                    padding-right: 10px;
                    padding-left: 20px;
                    list-style-type: none;
                }
                #nav li a {
                    font-family: "Futura Lt BT", "Futura Md BT";
                    text-decoration: none;
                    color: #e10101;
                    font-size: 0.9em;
                    line-height: 2em;
                }
                #nav li a:hover {
                    text-decoration: underline;
                }
                #nav #home a {
                    font-weight: bold;
                    color: #e10101;
                    font-family: "Futura Lt BT", "Futura Md BT";
                }

                • 6. Re: Explorer ignores font-weight:bold
                  Lulù85 Level 1

                  My goal is to indicate that the link HOME is active by setting the font-weight:bold.

                   

                  The Design and the Live view are correct, even the Firefox preview is correct, so I guess my CSS setting are ok...

                  The problem is the Internet preview that ignores the bold..

                  • 7. Re: Explorer ignores font-weight:bold
                    MurraySummers Level 8

                    #nav li#home a { font-weight:bold; } /* this is what you should use */

                     

                    Also, have you made Futura Lt BT etc. into web-suitable fonts?

                    • 8. Re: Explorer ignores font-weight:bold
                      Lulù85 Level 1

                      Done the CSS correction, but the problem with iE remains.

                       

                      Don't know how to make Futura etc. into web-suitable fonts? What it means?

                      • 9. Re: Explorer ignores font-weight:bold
                        MurraySummers Level 8

                        The fonts you can safely use on your web page (without taking special action) are pretty limited, since you can only be sure that your visitor has a very limited set of fonts. If you use a font that your visitor doesn't have installed, then they will not see your font. Instead they will see a system default font. That's probably not what you intended. Google "web safe fonts" to read more about this.

                         

                        If you have this in your code -

                         

                        <li id="home"><a href="whatever.html">Whatever</a></li>

                         

                        Then the CSS necessary to make that particular link appear bold is this -

                         

                        li#home a { font-weight:bold }

                         

                        If you have done this, and you are not seeing a bold font, then either you entered to code incorrectly, or there is some other CSS rule that is taking priority over this one. We can only know if that is the case by looking at your code/page.

                        • 10. Re: Explorer ignores font-weight:bold
                          Lulù85 Level 1

                          I tried to set font-family: Verdana and it works, Explorer shows me the bold.

                          So I guess that it is a Futura font problem..

                           

                          Now I try to read more about the safe fonts.

                          • 11. Re: Explorer ignores font-weight:bold
                            Lulù85 Level 1

                            Solved in this way:

                             

                            }
                            #nav li#home a {
                                font-weight: bold;
                                color: #e10101;
                                font-family:"Futura Md BT";
                            }

                             

                             

                            instead of  font-family: "Futura Lt BT", "Futura Md BT" (I just deleted one of the two)

                            • 12. Re: Explorer ignores font-weight:bold
                              MurraySummers Level 8

                              If you are not using a web safe version of futura, your visitors will only see the system's sans-serif font. So it's only you that sees the correct font. Thus it's a wasted effort.