Announcement

Collapse
No announcement yet.

a tip for css cross browser struggling

Collapse
X
 
  • Filter
  • Time
  • Show
Clear All
new posts

    a tip for css cross browser struggling

    try adding this to your stylesheet:

    HTML Code:
    /* GLOBAL RESET */
    html,body,p,div,img,h1,h2,h3,h4,li,ul,ol,dl,dd,dt,form,table,th,td,tr {
      margin:0px; 
      padding:0px; 
      border:0px; 
      border-collapse:separate; 
      border-spacing:0px;
      line-height:1.3ems
    }
    see, some browsers, have differeing values for padding, margins and other things on certain items.

    these differences can sometimes make pages render differently cross browser, with sometimes subtle and frustrating little bugs.

    once you've reset all these css values, you'll have to build them for each item.

    for example, a h1 will have no padding and margins, so you'll ahve to add them back in.

    HTML Code:
    h1 {
    padding:3px
    margin:3px
    }
    have fun.

    #2
    that's neat, Gabe
    thanks (from a true CSS noob!)
    Tracey

    Comment


      #3
      You may want to declare a line-height value as this is interpreted in different ways between browsers also.


      Bikster
      SellerDeck Designs and Responsive Themes

      Comment


        #4
        well, what line height would you recommend?

        and in ems?

        Comment


          #5
          1.3ems for me please.

          Comment


            #6
            line-height-geek: 0.25ems;

            line-height-ipod: 2.3ems;

            line-height-encrypt: -!1ems; /* imaginary number not a typo */

            LiNe-HeiGHt-ActINIc: 12px; !important


            Bikster
            SellerDeck Designs and Responsive Themes

            Comment

            Working...
            X