473,226 Members | 1,487 Online
Bytes | Software Development & Data Engineering Community
Post Job

Home Posts Topics Members FAQ

Join Bytes to post your question to a community of 473,226 software developers and data experts.

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
xa*@xahlee.org
http://xahlee.org/

Sep 2 '05 #1
14 2422
"Xah Lee" <xa*@xahlee.org> wrote:
is there somewhere i can find the default css for browsers?
No such thing. They all use different default styles.

That said, w3c published a sample default stylesheet
http://www.w3.org/TR/REC-CSS2/sample.html
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>.
Sounds dodgy.
a saparate question: do browers today actually render their
presentation thru a internal css?


Modern browsers typically yes.

--
Spartanicus
Sep 2 '05 #2

Spartanicus wrote:
That said, w3c published a sample default stylesheet
http://www.w3.org/TR/REC-CSS2/sample.html


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:
http://xahlee.org/Periodic_dosage_di...nga_pemci.html

Xah
xa*@xahlee.org
http://xahlee.org/

Sep 2 '05 #3
On 2 Sep 2005 14:31:10 -0700, "Xah Lee" <xa*@xahlee.org> wrote or
quoted :
p.l {display:list-item}


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.
Sep 2 '05 #4
Xah Lee wrote:

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

http://xahlee.org/Periodic_dosage_di...nga_pemci.html


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.
Sep 2 '05 #5
> why don't you just use list markup instead of
faking it?
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
xa*@xahlee.org
http://xahlee.org/
kchayka wrote: Xah Lee wrote:

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

http://xahlee.org/Periodic_dosage_di...nga_pemci.html


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


Sep 2 '05 #6
On 2 Sep 2005 15:46:47 -0700, "Xah Lee" <xa*@xahlee.org> wrote or
quoted :
with <li>, it needs <ul></ul>, which adds edting drudgery.


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.
Sep 2 '05 #7
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

:)
Sep 3 '05 #8
"Xah Lee" <xa*@xahlee.org> wrote:
That said, w3c published a sample default stylesheet
http://www.w3.org/TR/REC-CSS2/sample.html
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.


Because there are other default styles that you've not set
p.l{display:list-item;margin-left:1em;padding-left:1em}
sample page:
http://xahlee.org/Periodic_dosage_di...nga_pemci.html


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

--
Spartanicus
Sep 3 '05 #9
[attribution restored]

kchayka <us****@c-net.us> wrote:
why don't you just use list markup instead of
faking it?

Xah Lee <xa*@xahlee.org> wrote: 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.


Sorry, but you seem to have a fundamental misunderstanding 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, mc****@stanfordalumni.org, http://www.rahul.net/mcgrew/
Web Design Group, da***@htmlhelp.com, http://www.HTMLHelp.com/

"If at first you don't succeed, then plug it in and try again."
Sep 3 '05 #10
Roedy Green <lo*****@mindprod.com.invalid> wrote:
p.l {display:list-item}


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}


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

--
Spartanicus
Sep 3 '05 #11
Xah Lee wrote:
kchayka wrote:
why don't you just use list markup instead of
faking it?
• with my own list, i have more flexibility, for example, change my
bullet in tex directly without mucking with more style.


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?
• with <li>, it needs <ul></ul>, which adds edting drudgery.
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.
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.


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.
Sep 3 '05 #12
Spartanicus <in*****@invalid.invalid> wrote:
"Xah Lee" <xa*@xahlee.org> wrote:
is there somewhere i can find the default css for browsers?
No such thing. They all use different default styles.


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.)
That said, w3c published a sample default stylesheet
http://www.w3.org/TR/REC-CSS2/sample.html


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/
Sep 3 '05 #13
Roedy Green <lo*****@mindprod.com.invalid> in
news:l6********************************@4ax.com:
On 2 Sep 2005 14:31:10 -0700, "Xah Lee" <xa*@xahlee.org> wrote or
quoted :
p.l {display:list-item}
The catch is p comes with baggage, including a display:block. You have
to fiddle to make sure your choice overrides.


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 :-) )

A crude starting point would be:

p.l {display:list-item !important}


Sep 4 '05 #14

Richard Lewis wrote:
http://www.meyerweb.com/eric/thought...ndoing-htmlcss
...
Thanks a lot! Very interesting. Quality answer.

Xah
xa*@xahlee.org
http://xahlee.org/
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

:)


Sep 8 '05 #15

This thread has been closed and replies have been disabled. Please start a new discussion.

Similar topics

55
by: Haines Brown | last post by:
I've been setting font-size 1em; as the default in my style sheets. Until now, that seemed to be ok. But now I'm beginning to wonder. My aim is to have an easily readable, but not overly large...
8
by: Jukka K. Korpela | last post by:
I just noticed that most browsers render <table border="1"><tr><td><p>foo</p></td></tr></table> the same way as <table border="1"><tr><td>foo</td></tr></table> That is, they ignore the p...
88
by: Mike | last post by:
Is there a way to determine what a user's default email client is? I read a post from 3 years ago that said no. I guess I'm hoping something has come along since then.
3
by: Ike | last post by:
Is anyone aware of there exists a means in Javascript to determine the browser's default locale? Thanks, Ike
4
by: RC | last post by:
By default the radio button is a hollow circle for unchecked and filled black circle for checked similar for the check box button is a hollow square for unchecked and check symbol for...
2
by: Ben Long | last post by:
I'm curious if it is possible to detect the browsers default font and size? Most of the posts on this topic predate Windows XP, IE 5.5, Mozilla Firefox, et al. I've searched up and down the DOM...
1
by: p8000 | last post by:
This browser seems to have so many problems. One more: I try to have this Fire browser (version 2.0.0.1) as Not default, but so far, without success. How can I have this browser as not default...
4
by: Duncan Jones | last post by:
I'm almost certain there is no easy answer to this question, but I'd thought I'd just check.... *Ignoring* for a second why I want to do this, is there any way to specify that an element in a...
7
by: Anz | last post by:
I used the javascript functions as shown below. <a href="javascript:;;;" onclick="this.style.behavior='url(#default#homepage)'; this.setHomePage(location.href);"> But this code works for IE,...
2
isladogs
by: isladogs | last post by:
The next Access Europe meeting will be on Wednesday 7 Feb 2024 starting at 18:00 UK time (6PM UTC) and finishing at about 19:30 (7.30PM). In this month's session, the creator of the excellent VBE...
0
by: fareedcanada | last post by:
Hello I am trying to split number on their count. suppose i have 121314151617 (12cnt) then number should be split like 12,13,14,15,16,17 and if 11314151617 (11cnt) then should be split like...
0
by: stefan129 | last post by:
Hey forum members, I'm exploring options for SSL certificates for multiple domains. Has anyone had experience with multi-domain SSL certificates? Any recommendations on reliable providers or specific...
0
Git
by: egorbl4 | last post by:
Скачал я git, хотел начать настройку, а там вылезло вот это Что это? Что мне с этим делать? ...
1
by: davi5007 | last post by:
Hi, Basically, I am trying to automate a field named TraceabilityNo into a web page from an access form. I've got the serial held in the variable strSearchString. How can I get this into the...
0
by: DolphinDB | last post by:
The formulas of 101 quantitative trading alphas used by WorldQuant were presented in the paper 101 Formulaic Alphas. However, some formulas are complex, leading to challenges in calculation. Take...
0
by: DolphinDB | last post by:
Tired of spending countless mintues downsampling your data? Look no further! In this article, youll learn how to efficiently downsample 6.48 billion high-frequency records to 61 million...
0
by: Aftab Ahmad | last post by:
Hello Experts! I have written a code in MS Access for a cmd called "WhatsApp Message" to open WhatsApp using that very code but the problem is that it gives a popup message everytime I clicked on...
0
by: Aftab Ahmad | last post by:
So, I have written a code for a cmd called "Send WhatsApp Message" to open and send WhatsApp messaage. The code is given below. Dim IE As Object Set IE =...

By using Bytes.com and it's services, you agree to our Privacy Policy and Terms of Use.

To disable or enable advertisements and analytics tracking please visit the manage ads & tracking page.