6 Replies Latest reply: Apr 12, 2012 1:56 AM by martcol RSS

    Font Style Problem

    manojb05 Community Member

      hi all,

      I am put a 77 px font and line height 77 px, something like this WEBLINK

      but i dont get a same result, can i do any special setting for this?

      My link

        • 1. Re: Font Style Problem
          martcol Community Member
          body, td, th {
              color: #FF99FF;

              font-family: Arial,sans-serif;

              font-size: 77px;

              font-weight: bold;

              line-height: 1;

          }

           

          But styling that on the body element will mean it gets inherited.

          • 2. Re: Font Style Problem
            Rik Ramsay Community Member

            If you read through the source code of the website, they use letter spacing and word spacing to bring the letters together. They also had these elements as headers which means no need to add font-weight:bold.

            h1{

            font-size: 77px;

            letter-spacing: -0.08em;

            margin-bottom: 0.1em;

            text-rendering: optimizelegibility;

            word-spacing: -0.07em;

            line-height:1;

            }

            • 3. Re: Font Style Problem
              manojb05 Community Member

              thanks for your feedback, but color mouseover comes very slowely, how can done.

              CSS this facility is run all browser text-rendering: optimizelegibility;

              • 4. Re: Font Style Problem
                Rik Ramsay Community Member

                h1 a:link {

                     -webkit-transition: all .25s ease-in;

                      -moz-transition: all .25s ease-in;

                      -o-transition: all .25s ease-in;

                      -ms-transition: all .25s ease-in;

                      transition: all .25s ease-in;

                     text-decoration: none;

                }


                • 5. Re: Font Style Problem
                  manojb05 Community Member

                  thanks for your reply.

                  Rik my h1 apply nothing is happend css is given below

                  h1{

                            font-size: 77px;

                            letter-spacing: -0.08em;

                            margin-bottom: 0.1em;

                            text-rendering: optimizelegibility;

                            word-spacing: -0.07em;

                            line-height:1;

                            font-family: Arial, Helvetica, sans-serif;

                            color: #FF99FF;

                            a:link {

                       -webkit-transition: all .25s ease-in;

                        -moz-transition: all .25s ease-in;

                        -o-transition: all .25s ease-in;

                        -ms-transition: all .25s ease-in;

                        transition: all .25s ease-in;

                       text-decoration: none;

                  }

                  • 6. Re: Font Style Problem
                    martcol Community Member

                    manojb05 wrote:

                     

                    thanks for your reply.

                    Rik my h1 apply nothing is happend css is given below

                    h1{

                              font-size: 77px;

                              letter-spacing: -0.08em;

                              margin-bottom: 0.1em;

                              text-rendering: optimizelegibility;

                              word-spacing: -0.07em;

                              line-height:1;

                              font-family: Arial, Helvetica, sans-serif;

                              color: #FF99FF;

                              a:link {

                         -webkit-transition: all .25s ease-in;

                          -moz-transition: all .25s ease-in;

                          -o-transition: all .25s ease-in;

                          -ms-transition: all .25s ease-in;

                          transition: all .25s ease-in;

                         text-decoration: none;

                    }

                    You haven't finished the rule for h1 there.  It needs a closing curly brace }