468,257 Members | 1,470 Online
Bytes | Developer Community
New Post

Home Posts Topics Members FAQ

Post your question to a community of 468,257 developers. It's quick & easy.

OL list with bold LI?

Hi,
I would like to have a OL list, that is "ordinary" in other aspect
except this:

Since every <LI> will have more than 2 lines of text, I like to make
the first line bold (kind of sub header :-) where I like to have the
number bold also. All other lines within the same LI is to be normal
text, with the closing </LI> in the end of last line.

Now, getting the first line text bold is no problem :-)
But I can't find a valid way (for XHTML 1.1) to make the numbers in
that list bold. Do somebody know how to do it, if it is possible?

TIA

--
/Arne

Jul 20 '05 #1
6 21056
Arne wrote:
Since every <LI> will have more than 2 lines of text, I like to make
the first line bold (kind of sub header :-) where I like to have the
number bold also. All other lines within the same LI is to be normal
text, with the closing </LI> in the end of last line.
Url?
I can't find a valid way (for XHTML 1.1) to make the numbers in
that list bold.


Without knowing the code, I can only suggest a possibility:

<STYLE TYPE="text/css">
ol {font-weight: bold ;}
ol li div {font-weight: normal ;}
</STYLE>

<BODY>
<ol>
<li>
here lies item 1, line 1
<div>here lies item 1 line 2</div>
</li>
<li>
here lies item 2, line 1
<div>here lies item 2 line 2</div>
</li>
</ol>

</BODY>

Tested in Moz 1.6, IE/Win 5.5, O 7.23.

--
Brian (remove "invalid" from my address to email me)
http://www.tsmchughs.com/
Jul 20 '05 #2

Brian wrote:
Arne wrote:

Since every <LI> will have more than 2 lines of text, I like to make
the first line bold (kind of sub header :-) where I like to have the
number bold also. All other lines within the same LI is to be normal
text, with the closing </LI> in the end of last line.

Url?

I can't find a valid way (for XHTML 1.1) to make the numbers in
that list bold.

Without knowing the code, I can only suggest a possibility:

<STYLE TYPE="text/css">
ol {font-weight: bold ;}
ol li div {font-weight: normal ;}
</STYLE>

<BODY>
<ol>
<li>
here lies item 1, line 1
<div>here lies item 1 line 2</div>
</li>
<li>
here lies item 2, line 1
<div>here lies item 2 line 2</div>
</li>
</ol>

</BODY>

Tested in Moz 1.6, IE/Win 5.5, O 7.23.


Of cause, even a simple solution is hard to find sometime! I now
compare my self with the professor who search for his glasses when he
had them on the forhead :-)

Thank's Brian!

--
/Arne

Jul 20 '05 #3
*Arne* <ar********@telia.com>:

Since every <LI> will have more than 2 lines of text, I like to make
the first line bold (kind of sub header :-) where I like to have the
number bold also. All other lines within the same LI is to be normal
text, with the closing </LI> in the end of last line.
You're sure you don't want

dl {counter-reset: def;}
dt:before {content: counter(def) ". "; counter-increment: def;}
dt {font-weight: bolder;}

<dl>
<dt>Bold Foo</dt>
<dd>Normal Bar</dd>
...
</dl>?
Now, getting the first line text bold is no problem :-)
li:first-line {font-weight: bolder;}
But I can't find a valid way (for XHTML 1.1)
Say, you're maintaining two versions (HTML 4.01 and XHTML 1.1)?
to make the numbers in that list bold.


List markers are a bit badly or underdefined in CSS2. In CSS3

li::marker {font-weight: bolder;}

would do. Maybe

ul, ol {font-weight: bold;}
li {font-weight: lighter;}

helps.

--
"When a thing has been said and well, have no scruple. Take it and copy it."
Anatole France
Jul 20 '05 #4

Christoph Paeper wrote:
*Arne* <ar********@telia.com>:
Since every <LI> will have more than 2 lines of text, I like to make
the first line bold (kind of sub header :-) where I like to have the
number bold also. All other lines within the same LI is to be normal
text, with the closing </LI> in the end of last line.

You're sure you don't want

dl {counter-reset: def;}
dt:before {content: counter(def) ". "; counter-increment: def;}
dt {font-weight: bolder;}

<dl>
<dt>Bold Foo</dt>
<dd>Normal Bar</dd>
...
</dl>?


Interesting. Hav'nt seen definition list used that way before.

Say, you're maintaining two versions (HTML 4.01 and XHTML 1.1)?
I'm not sure what you mean. The question was for a XHTML page I'm just
"playing around" with so far, as I trying to learn more about that and
CSS. "Officially" I still do HTML 4.01 sites. :-)
to make the numbers in that list bold.

List markers are a bit badly or underdefined in CSS2. In CSS3

li::marker {font-weight: bolder;}


Just what I was wondering about! But not even Mozilla 1.7 supports it?
would do. Maybe

ul, ol {font-weight: bold;}
li {font-weight: lighter;}

helps.


I used what Brian suggested and it works just like wanted, and also
validate. So I'm happy :-)

Thank's for replying!

--
/Arne

Jul 20 '05 #5
Arne wrote:
Since every <LI> will have more than 2 lines of text, I like to make
the first line bold (kind of sub header :-) where I like to have the
number bold also. All other lines within the same LI is to be normal
text, with the closing </LI> in the end of last line.

Now, getting the first line text bold is no problem :-)
But I can't find a valid way (for XHTML 1.1) to make the numbers in
that list bold. Do somebody know how to do it, if it is possible?


This is worth a shot:

ol { font-weight: bold; }
ol li:first-line { font-weight: bold; }
ol li { font-weight: normal; }

--
Shawn K. Quinn
Jul 20 '05 #6
Shawn K. Quinn wrote:
This is worth a shot:

ol li:first-line { font-weight: bold; }


Careful with that one. Mozilla is quite buggy when :first-line is
combined in some way with :link:hover, iirc.

See bug 177539 in Moz/Bugzilla.

http://bugzilla.mozilla.org/

--
Brian (remove "invalid" from my address to email me)
http://www.tsmchughs.com/
Jul 20 '05 #7

This discussion thread is closed

Replies have been disabled for this discussion.

Similar topics

4 posts views Thread by Wilhelm Kutting | last post: by
1 post views Thread by Sachin | last post: by
2 posts views Thread by genojoe | last post: by
5 posts views Thread by donpro | last post: by
1 post views Thread by somsom | last post: by
reply views Thread by Guilherme Polo | last post: by
reply views Thread by kermitthefrogpy | last post: by
reply views Thread by zattat | last post: by
By using this site, you agree to our Privacy Policy and Terms of Use.