[css-d] how to make LI text justify to the right of the bullet?
I guess I've never had to deal with LI text long enough to wrap to the second line. Now I notice that the second line begins under the bullet and not justified to the same place as the first line of text. Any way to fix that? Francesco __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] how to make LI text justify to the right of the bullet?
At 07:09 PM 1/20/2006, Francesco wrote:
I guess I've never had to deal with LI text long
enough to wrap to the second line. Now I notice that
the second line begins under the bullet and not
justified to the same place as the first line of text.
Any way to fix that?
How about this:
lidivThis is text that wraps around/div/li
Containing the text in a block element prevents it from wrapping
farther left than the first word of the text.
In place of div you could also use a normally inline element such as
A or SPAN that you style {display: block;}.
Paul
__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] how to make LI text justify to the right of the bullet?
On 21 Jan 2006, at 12:09 pm, Francesco wrote: I guess I've never had to deal with LI text long enough to wrap to the second line. Now I notice that the second line begins under the bullet and not justified to the same place as the first line of text. Any way to fix that? ?? The defaults behaviour, in all browsers on various computers around me, is having the bullet hanging outside of the line-box. If that is not the case on your side, I think there is something wrong, or you modified the behaviour in your stylesheet. As always, posting the url of a test case is very useful. http://dev.l-c-n.com/_temp/list-style-position.php To change the positioning, you can use the list-style-position property. Philippe --- Philippe Wittenbergh http://emps.l-c-n.com/ __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] how to make LI text justify to the right of the bullet?
enough to wrap to the second line. Now I notice that the second line begins under the bullet and not justified to the same place as the first line of text. Any way to fix that? also, check that you don't have any text-indent as that will give you that behavior. ask me how I know ;) __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] how to make LI text justify to the right of the bullet?
- Original Message -
From: Francesco [EMAIL PROTECTED]
Subject: [css-d] how to make LI text justify to the right of the bullet?
I guess I've never had to deal with LI text long
enough to wrap to the second line. Now I notice that
the second line begins under the bullet and not
justified to the same place as the first line of text.
Any way to fix that?
Francesco
Francesco,
As Phillipe said, check the list-style-position property. See also,
http://www.w3schools.com/css/pr_list-style-position.asp
With a declaration such as,
ul{
list-style-position: outside;
}
the first line of the list text would start to the right of the bullet;
subsequent lines would wrap with their left edges aligned with that of the
first.
In your CSS declaration,
ul.box {
list-style-type: square;
list-style-image: none;
list-style-position: inside;
}
the list-style-position: inside; declaration causes the effect you describe.
The first line of the list text would start to the right of the bullet;
subsequent lines would wrap beneath the bullet, with their left edges
aligning with its left edge.
The site looks very nice in Firefox 1.5 / Windows XP - SP2. Works with the
sytles off, the text size doubled, and the screen resolution set at 2180 x
1024.
Cheers,
Peter
Peter Hyde-Smith
[EMAIL PROTECTED]
__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] how to make LI text justify to the right of the bullet?
Thanks everyone. A combination of: list-style-position: outside; and placing a specific left margin on the li fixed the issue. Francesco __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
