default css for browsers

Collapse
This topic is closed.
X
X
 
  • Time
  • Show
Clear All
new posts
  • Xah Lee

    default css for browsers

    is there somewhere i can find the default css for browsers?

    e.g. what's the usual rendering in terms of css for <p>, <ul> etc.

    in particular, right now i'm interested in creating a style similar to
    <ul> and <li>. Of course i can eyeball and come up with a css, but want
    to be sure.

    ----------

    a saparate question: do browers today actually render their
    presentation thru a internal css?

    Xah
    xah@xahlee.org
    ∑ http://xahlee.org/

  • Spartanicus

    #2
    Re: default css for browsers

    "Xah Lee" <xah@xahlee.org > wrote:
    [color=blue]
    >is there somewhere i can find the default css for browsers?[/color]

    No such thing. They all use different default styles.

    That said, w3c published a sample default stylesheet

    [color=blue]
    >e.g. what's the usual rendering in terms of css for <p>, <ul> etc.
    >
    >in particular, right now i'm interested in creating a style similar to
    ><ul> and <li>.[/color]

    Sounds dodgy.
    [color=blue]
    >a saparate question: do browers today actually render their
    >presentation thru a internal css?[/color]

    Modern browsers typically yes.

    --
    Spartanicus

    Comment

    • Xah Lee

      #3
      Re: default css for browsers


      Spartanicus wrote:[color=blue]
      > That said, w3c published a sample default stylesheet
      > http://www.w3.org/TR/REC-CSS2/sample.html[/color]

      according to it, <li> is
      li {display:list-item}

      but that' doesn't seems to capture it. If in my html page i use

      p.l {display:list-item}

      it doesn't seems to have any effect.

      currently i emulate li by:
      p.l{margin-top:5px; margin-bottom:5px}

      sample page:


      Xah
      xah@xahlee.org
      ∑ http://xahlee.org/

      Comment

      • Roedy Green

        #4
        Re: default css for browsers

        On 2 Sep 2005 14:31:10 -0700, "Xah Lee" <xah@xahlee.org > wrote or
        quoted :
        [color=blue]
        >p.l {display:list-item}[/color]

        The catch is p comes with baggage, including a display:block. You have
        to fiddle to make sure your choice overrides.

        A crude starting point would be:

        p.l {display:list-item !important}
        --
        Canadian Mind Products, Roedy Green.
        http://mindprod.com Again taking new Java programming contracts.

        Comment

        • kchayka

          #5
          Re: default css for browsers

          Xah Lee wrote:[color=blue]
          >
          > currently i emulate li by:
          > p.l{margin-top:5px; margin-bottom:5px}
          >
          > http://xahlee.org/Periodic_dosage_di...nga_pemci.html[/color]

          This begs the question: why don't you just use list markup instead of
          faking it?

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

          Comment

          • Xah Lee

            #6
            Re: default css for browsers

            > why don't you just use list markup instead of[color=blue]
            > faking it?[/color]

            some personal reasons...

            • with <li>, some browser will not copy the browser generated bullet
            when doing the copy & paste.
            • with my own list, i have more flexibility, for example, change my
            bullet in tex directly without mucking with more style.
            • with <li>, it needs <ul></ul>, which adds edting drudgery.
            ....

            but the thing is, if CSS is complete and moder browsers use it
            internally for presentation, there really should have css
            representation of <li> style.

            Xah
            xah@xahlee.org
            ∑ http://xahlee.org/


            kchayka wrote:[color=blue]
            > Xah Lee wrote:[color=green]
            > >
            > > currently i emulate li by:
            > > p.l{margin-top:5px; margin-bottom:5px}
            > >
            > > http://xahlee.org/Periodic_dosage_di...nga_pemci.html[/color]
            >
            > This begs the question: why don't you just use list markup instead of
            > faking it?
            >[/color]

            Comment

            • Roedy Green

              #7
              Re: default css for browsers

              On 2 Sep 2005 15:46:47 -0700, "Xah Lee" <xah@xahlee.org > wrote or
              quoted :
              [color=blue]
              >• with <li>, it needs <ul></ul>, which adds edting drudgery.[/color]

              Presumably though the indent works from <ul> tags, not the <li>, so I
              would expect your <p class="l"> not to indent.

              That busines of browsers chopping the bullets and numbering when you
              copy paste is a real bear. I have wasted many hours in my life
              restoring them.
              --
              Canadian Mind Products, Roedy Green.
              http://mindprod.com Again taking new Java programming contracts.

              Comment

              • Richard Lewis

                #8
                Re: default css for browsers

                Hi,

                have a look at

                There’s an aspect of document presentation most of us don’t consider: the browser defaults.  If you take an HTML or XHTML document—for the purposes of this exercise, assume it contains no presentational markup—and load it up in a Web browser with no CSS applied, there will still be some presentational effects.  A level-one heading, for […]


                The gist is, if you're using Firefox, you can find a file on your system
                called html.css
                (in C:\Program Files\Mozilla Firefox\res and C:\Program
                Files\Netscape\ Netscape Browser\res
                for me, but the files are exactly the same.) which contain default .css used
                by the browser

                <ul> and <li> are basically:

                ul {
                display: block;
                list-style-type: disc;
                margin: 1em 0;
                -moz-padding-start: 40px;
                -moz-counter-reset: -html-counter 0;
                }

                li {
                display: list-item;
                -moz-float-edge: margin-box;
                }

                I've not tried these, and I know nothing about mozilla proprietary
                properties, but it looks
                quite plausible.
                There's also a lot of stuff to do with stuff nested inside of lists, eg
                ul ul, ul ol, ul dir, ...

                all very interesting. Go to the article for more info

                :)


                Comment

                • Spartanicus

                  #9
                  Re: default css for browsers

                  "Xah Lee" <xah@xahlee.org > wrote:
                  [color=blue][color=green]
                  >> That said, w3c published a sample default stylesheet
                  >> http://www.w3.org/TR/REC-CSS2/sample.html[/color]
                  >
                  >according to it, <li> is
                  >li {display:list-item}
                  >
                  >but that' doesn't seems to capture it. If in my html page i use
                  >
                  >p.l {display:list-item}
                  >
                  >it doesn't seems to have any effect.[/color]

                  Because there are other default styles that you've not set
                  p.l{display:lis t-item;margin-left:1em;paddin g-left:1em}
                  [color=blue]
                  >sample page:
                  >http://xahlee.org/Periodic_dosage_di...nga_pemci.html[/color]

                  As I suspected this is abuse of CSS to try and hide incorrect markup.

                  --
                  Spartanicus

                  Comment

                  • Darin McGrew

                    #10
                    Re: default css for browsers

                    [attribution restored]

                    kchayka <usenet@c-net.us> wrote:[color=blue][color=green]
                    >> why don't you just use list markup instead of
                    >> faking it?[/color][/color]

                    Xah Lee <xah@xahlee.org > wrote:[color=blue]
                    > some personal reasons...
                    > [snip]
                    > but the thing is, if CSS is complete and moder browsers use it
                    > internally for presentation, there really should have css
                    > representation of <li> style.[/color]

                    Sorry, but you seem to have a fundamental misunderstandin g of what CSS is
                    supposed to be. CSS is optional. CSS provides optional presentation
                    suggestions that browsers may or may not use. The underlying markup must
                    make sense, or those who don't use your CSS (for whatever reason) will be
                    stuck with a mess.
                    --
                    Darin McGrew, mcgrew@stanford alumni.org, http://www.rahul.net/mcgrew/
                    Web Design Group, darin@htmlhelp. com, http://www.HTMLHelp.com/

                    "If at first you don't succeed, then plug it in and try again."

                    Comment

                    • Spartanicus

                      #11
                      Re: default css for browsers

                      Roedy Green <look-on@mindprod.com .invalid> wrote:
                      [color=blue][color=green]
                      >>p.l {display:list-item}[/color]
                      >
                      >The catch is p comes with baggage, including a display:block. You have
                      >to fiddle to make sure your choice overrides.
                      >
                      >A crude starting point would be:
                      >
                      >p.l {display:list-item !important}[/color]

                      Author normal style rules trump UA default styles in the cascade, so
                      there is no need for the !important

                      --
                      Spartanicus

                      Comment

                      • kchayka

                        #12
                        Re: default css for browsers

                        Xah Lee wrote:[color=blue]
                        > kchayka wrote:[color=green]
                        >> why don't you just use list markup instead of
                        >> faking it?[/color]
                        >
                        > • with my own list, i have more flexibility, for example, change my
                        > bullet in tex directly without mucking with more style.[/color]

                        So you think that changing the list marker/bullet on 20 individual lines
                        is somehow better than changing it once in the CSS? Uh, OK... I guess...
                        What happens when you want to change it in all pages?
                        [color=blue]
                        > • with <li>, it needs <ul></ul>, which adds edting drudgery.[/color]

                        Now that's silly. 2 lines isn't even worth mentioning, especially when
                        it is more correct markup than what you appear to be doing. You add far
                        more characters by adding list markers in each paragraph. That would be
                        drudgery for me.
                        [color=blue]
                        > but the thing is, if CSS is complete and moder browsers use it
                        > internally for presentation, there really should have css
                        > representation of <li> style.[/color]

                        I don't really understand what you're trying to say here, but no matter.
                        You can style both <ul> and <li> just as easily as <p>, in case you
                        don't care for the default list styling. And in your case, <li> is
                        semantically better.

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

                        Comment

                        • Jukka K. Korpela

                          #13
                          Re: default css for browsers

                          Spartanicus <invalid@invali d.invalid> wrote:
                          [color=blue]
                          > "Xah Lee" <xah@xahlee.org > wrote:
                          >[color=green]
                          >>is there somewhere i can find the default css for browsers?[/color]
                          >
                          > No such thing. They all use different default styles.[/color]

                          Besides, they have presentational idiosyncrasies that are not describable
                          in CSS, and they may have failed to present their default style sheet (real
                          or virtual) to the public. For example, for IE, we need to infer things
                          from the browser's behavior. It's more difficult than you might think,
                          since the rendering of an element depends on context. (For example,
                          vertical margins for elements may disappear if the element is the content
                          of a table cell - rather naturally, but it complicates things.)
                          [color=blue]
                          > That said, w3c published a sample default stylesheet
                          > http://www.w3.org/TR/REC-CSS2/sample.html[/color]

                          That sample stylesheet makes obscure claims on describing carefully the
                          actual browser behavior _and_ on recommending how browsers should behave.
                          Don't rely on it at all, though you might use it as a checklist of things
                          that browsers _might_ do and you _might_ wish to do.

                          (Besides, CSS 2 is effectively dead and CSS 2.1 isn't born yet. Not
                          surprisingly, the sample style sheets in CSS 1, CSS 2, and CSS 2.1 are
                          all different, in essential ways.)

                          The morale is that when writing an author style sheet, you should be
                          prepared to anything reasonably imaginable in browsers' default style
                          sheets, and somewhat more. For example, if you would like to make the
                          indentation of list smaller than what browsers typically use, you should
                          set all of the following: padding-left and margin-left for the list element
                          (ul or ol) and for the list item elements (li). You cannot know, or you
                          should at least pretend you don't know, which of them a browser uses for
                          the indentation. So if you naively just set e.g. margin-left: 1.5em for
                          a ul element, you might actually _increase_ the nesting, on browsers that
                          by default use padding-left to create considerable indentation (and
                          default margin-left to zero).

                          --
                          Yucca, http://www.cs.tut.fi/~jkorpela/

                          Comment

                          • Quasimido CSS

                            #14
                            Re: default css for browsers

                            Roedy Green <look-on@mindprod.com .invalid> in
                            news:l6jhh193kn 7t9tih6ng49kiok tf9t02gc8@4ax.c om:
                            [color=blue]
                            > On 2 Sep 2005 14:31:10 -0700, "Xah Lee" <xah@xahlee.org > wrote or
                            > quoted :
                            >[color=green]
                            >>p.l {display:list-item}[/color]
                            >
                            > The catch is p comes with baggage, including a display:block. You have
                            > to fiddle to make sure your choice overrides.[/color]

                            ah, baggage.
                            just coincidentally i recently solved a :hover problem when i editd the element description.
                            had been
                            p (etc)
                            became
                            a (etc)
                            this cleared up some characteristics that i refused to "reverse", even when I tried explicitly
                            "overriding " them in the styles
                            (yeah, this was a *really* annoying problem :-) )

                            [color=blue]
                            > A crude starting point would be:
                            >
                            > p.l {display:list-item !important}[/color]

                            Comment

                            • Xah Lee

                              #15
                              Re: default css for browsers


                              Richard Lewis wrote:[color=blue]
                              > http://www.meyerweb.com/eric/thought...ndoing-htmlcss
                              > ...[/color]

                              Thanks a lot! Very interesting. Quality answer.

                              Xah
                              xah@xahlee.org
                              ∑ http://xahlee.org/
                              [color=blue]
                              > Hi,
                              > have a look at
                              > http://www.meyerweb.com/eric/thought...ndoing-htmlcss
                              >
                              > The gist is, if you're using Firefox, you can find a file on your system
                              > called html.css
                              > (in C:\Program Files\Mozilla Firefox\res and C:\Program
                              > Files\Netscape\ Netscape Browser\res
                              > for me, but the files are exactly the same.) which contain default .css used
                              > by the browser
                              >
                              > <ul> and <li> are basically:
                              >
                              > ul {
                              > display: block;
                              > list-style-type: disc;
                              > margin: 1em 0;
                              > -moz-padding-start: 40px;
                              > -moz-counter-reset: -html-counter 0;
                              > }
                              >
                              > li {
                              > display: list-item;
                              > -moz-float-edge: margin-box;
                              > }
                              >
                              > I've not tried these, and I know nothing about mozilla proprietary
                              > properties, but it looks
                              > quite plausible.
                              > There's also a lot of stuff to do with stuff nested inside of lists, eg
                              > ul ul, ul ol, ul dir, ...
                              >
                              > all very interesting. Go to the article for more info
                              >
                              > :)[/color]

                              Comment

                              Working...