Why do this in a style list

Collapse
This topic is closed.
X
X
 
  • Time
  • Show
Clear All
new posts
  • MMan22@hotmail.com

    Why do this in a style list

    I'm learning how to use style sheets and so I've been looking how other
    people use them. I found a style file that set borders and padding to
    most of the std Tags to zero (sample below). Some get redefined again
    later.

    Apart from putting all the tags onto one line (comma seperated), why
    would you do this ?
    Is it to do with setting different client defaults ?

    Leigh


    HTML {
    BORDER-TOP-WIDTH: 0px; PADDING-RIGHT: 0px; PADDING-LEFT: 0px;
    BORDER-LEFT-WIDTH: 0px; BORDER-BOTTOM-WIDTH: 0px; PADDING-BOTTOM: 0px;
    MARGIN: 0px; PADDING-TOP: 0px; BORDER-RIGHT-WIDTH: 0px
    }
    BODY {
    BORDER-TOP-WIDTH: 0px; PADDING-RIGHT: 0px; PADDING-LEFT: 0px;
    BORDER-LEFT-WIDTH: 0px; BORDER-BOTTOM-WIDTH: 0px; PADDING-BOTTOM: 0px;
    MARGIN: 0px; PADDING-TOP: 0px; BORDER-RIGHT-WIDTH: 0px
    }
    UL {
    BORDER-TOP-WIDTH: 0px; PADDING-RIGHT: 0px; PADDING-LEFT: 0px;
    BORDER-LEFT-WIDTH: 0px; BORDER-BOTTOM-WIDTH: 0px; PADDING-BOTTOM: 0px;
    MARGIN: 0px; PADDING-TOP: 0px; BORDER-RIGHT-WIDTH: 0px
    }
    OL {
    BORDER-TOP-WIDTH: 0px; PADDING-RIGHT: 0px; PADDING-LEFT: 0px;
    BORDER-LEFT-WIDTH: 0px; BORDER-BOTTOM-WIDTH: 0px; PADDING-BOTTOM: 0px;
    MARGIN: 0px; PADDING-TOP: 0px; BORDER-RIGHT-WIDTH: 0px
    }
    LI {
    BORDER-TOP-WIDTH: 0px; PADDING-RIGHT: 0px; PADDING-LEFT: 0px;
    BORDER-LEFT-WIDTH: 0px; BORDER-BOTTOM-WIDTH: 0px; PADDING-BOTTOM: 0px;
    MARGIN: 0px; PADDING-TOP: 0px; BORDER-RIGHT-WIDTH: 0px
    }
    P {
    BORDER-TOP-WIDTH: 0px; PADDING-RIGHT: 0px; PADDING-LEFT: 0px;
    BORDER-LEFT-WIDTH: 0px; BORDER-BOTTOM-WIDTH: 0px; PADDING-BOTTOM: 0px;
    MARGIN: 0px; PADDING-TOP: 0px; BORDER-RIGHT-WIDTH: 0px
    }
    H1 {
    BORDER-TOP-WIDTH: 0px; PADDING-RIGHT: 0px; PADDING-LEFT: 0px;
    BORDER-LEFT-WIDTH: 0px; BORDER-BOTTOM-WIDTH: 0px; PADDING-BOTTOM: 0px;
    MARGIN: 0px; PADDING-TOP: 0px; BORDER-RIGHT-WIDTH: 0px
    }
    .....etc

  • Barbara de Zoete

    #2
    Re: Why do this in a style list

    On 3 Aug 2005 02:28:24 -0700, <MMan22@hotmail .com> wrote:
    [color=blue]
    > I'm learning how to use style sheets and so I've been looking how other
    > people use them. I found a style file that set borders and padding to
    > most of the std Tags to zero (sample below). Some get redefined again
    > later.
    >[/color]
    [color=blue]
    > HTML {
    > BORDER-TOP-WIDTH: 0px; PADDING-RIGHT: 0px; PADDING-LEFT: 0px;
    > BORDER-LEFT-WIDTH: 0px; BORDER-BOTTOM-WIDTH: 0px; PADDING-BOTTOM: 0px;
    > MARGIN: 0px; PADDING-TOP: 0px; BORDER-RIGHT-WIDTH: 0px
    > }
    > BODY {
    > BORDER-TOP-WIDTH: 0px; PADDING-RIGHT: 0px; PADDING-LEFT: 0px;
    > BORDER-LEFT-WIDTH: 0px; BORDER-BOTTOM-WIDTH: 0px; PADDING-BOTTOM: 0px;
    > MARGIN: 0px; PADDING-TOP: 0px; BORDER-RIGHT-WIDTH: 0px
    > }[/color]
    [ snipped the rest ]
    [color=blue]
    > Apart from putting all the tags onto one line (comma seperated),
    >[/color]
    This is a piece of code that's written badly. * { padding:0;borde r:0;margin:0; }
    Would suffice.
    [color=blue]
    > why
    > would you do this ?
    > Is it to do with setting different client defaults ?
    >[/color]

    Yes. It could be. Default padding, borders and margins on elements can be set
    differently for different browsers. With setting all of them to nill (and
    defining where you need them, how you want them) you can try to eliminate those
    differences.

    You can also except them for what they are: minor differences. A visitor is not
    going to see a site in various browsers (or is unlikely to). Minor differences
    in rendering really don't matter at all. Pixel perfect desing cannot be achieved
    anyway (images and pdf's might do the trick, but hey, this is ciwas, and who
    would want that).

    --
    ,-- --<--@ -- PretLetters: 'woest wyf', met vele interesses: ----------.
    | weblog | http://home.wanadoo.nl/b.de.zoete/_private/weblog.html |
    | webontwerp | http://home.wanadoo.nl/b.de.zoete/html/webontwerp.html |
    |zweefvliegen | http://home.wanadoo.nl/b.de.zoete/html/vliegen.html |
    `-------------------------------------------------- --<--@ ------------'

    Comment

    • Spartanicus

      #3
      Re: Why do this in a style list

      MMan22@hotmail. com wrote:
      [color=blue]
      >I'm learning how to use style sheets and so I've been looking how other
      >people use them.[/color]

      Bad idea, the majority of HTML and CSS out there is of very poor
      quality. Even looking at good code doesn't teach you how and why it was
      used, or how to do it yourself.

      Only a good HTML and CSS tutorial can teach you how to do it yourself.

      --
      Spartanicus

      Comment

      • junk

        #4
        Re: Why do this in a style list

        MMan22@hotmail. com wrote:[color=blue]
        > I'm learning how to use style sheets[/color]

        have a look at http://webhost.bridgew.edu/etribou/layouts/index.html

        the layouts are well commented.

        Comment

        • MMan22@hotmail.com

          #5
          Re: Why do this in a style list

          Thanks for the tips eyeryone

          Leigh

          Comment

          • kchayka

            #6
            Re: Why do this in a style list

            MMan22@hotmail. com wrote:
            [color=blue]
            > I found a style file that set borders and padding to
            > most of the std Tags to zero (sample below).
            >
            > HTML {
            > BORDER-TOP-WIDTH: 0px; PADDING-RIGHT: 0px; PADDING-LEFT: 0px;
            > BORDER-LEFT-WIDTH: 0px; BORDER-BOTTOM-WIDTH: 0px; PADDING-BOTTOM: 0px;
            > MARGIN: 0px; PADDING-TOP: 0px; BORDER-RIGHT-WIDTH: 0px
            > }[/color]

            This looks like what Windows IE does with a "Save Web Page (complete)".
            It takes a perfectly clean, compact, elegantly written stylesheet and
            rewrites it to the kind of sludge you see here, presumably so it is
            optimized for IE rendering. This is ugly, to say the least. IE tends to
            mangle the HTML, too.

            If you are downloading web pages so you can examine the code later, tis
            a much better practice in IE to View Source, then save that. The
            resulting files should be left in their original form.

            You might also use a different browser to save web pages, that won't
            mangle the code so much. mozilla variations (Firefox, NS7, etc) usually
            do very little damage with a Save Complete.

            --
            Reply email address is a bottomless spam bucket.
            Please reply to the group so everyone can share.

            Comment

            Working...