|
P: n/a
|
Hi all,
My site's content has a lot of bulleted lists, which seem
to get hard to read when the lines are too long. No problem,
I thought:
li {
max-width: 42em;
margin: .5em 0 .5em 0;
}
However IE seems to stick its middle finger up at this and
ignore it.
I don't want a margin or padding because it will waste space
on small screens.
Is there anything else I can do?
TIA,
--
jc
Remove the -not from email
| |
Share this Question
|
P: n/a
|
Jeremy Collins wrote: Hi all,
My site's content has a lot of bulleted lists, which seem
to get hard to read when the lines are too long. No problem,
I thought:
li {
max-width: 42em;
margin: .5em 0 .5em 0;
}
However IE seems to stick its middle finger up at this and
ignore it.
I don't want a margin or padding because it will waste space
on small screens.
Is there anything else I can do?
Make content for the "margins" so no space is wasted, or
have the margins at 10%, which will waste less on smaller
screens, or have your content in two columns, or have a link
saying: "for wide windows" which will open an identical page
with margins...
--
Els
Sonhos vem. Sonhos vão. O resto é imperfeito.
- Renato Russo - | |
|
P: n/a
|
Els wrote: Jeremy Collins wrote:
li {
max-width: 42em;
margin: .5em 0 .5em 0;
}
However IE seems to stick its middle finger up at this and
ignore it.
Make content for the "margins" so no space is wasted, or have the
margins at 10%, which will waste less on smaller screens, or have your
content in two columns, or have a link saying: "for wide windows" which
will open an identical page with margins...
I've already got additional content down the sides, but the
proportional margin is a good idea and works well, thanks.
But you've exposed a gap in my knowledge <g>:
li {
margin-right: 10%;
}
10% of what? The screen? The containing <DIV>? It's hard to tell
by looking at it...
--
jc
Remove the -not from email | |
|
P: n/a
|
Jeremy Collins wrote: Els wrote:
Jeremy Collins wrote:
li {
max-width: 42em;
margin: .5em 0 .5em 0;
}
However IE seems to stick its middle finger up at this and
ignore it.
Make content for the "margins" so no space is wasted, or have the
margins at 10%, which will waste less on smaller screens, or have your
content in two columns, or have a link saying: "for wide windows"
which will open an identical page with margins...
I've already got additional content down the sides, but the
proportional margin is a good idea and works well, thanks.
But you've exposed a gap in my knowledge <g>:
li {
margin-right: 10%;
}
10% of what? The screen? The containing <DIV>? It's hard to tell
by looking at it...
Parent element.
In the case of margins next to the containing div: the body.
Set it to 50% and it will be easy to tell by looking at it...
--
Els
Sonhos vem. Sonhos vão. O resto é imperfeito.
- Renato Russo - | |
|
P: n/a
|
Els wrote: Jeremy Collins wrote:
But you've exposed a gap in my knowledge <g>:
li {
margin-right: 10%;
}
10% of what? The screen? The containing <DIV>? It's hard to tell
by looking at it...
Parent element.
In the case of margins next to the containing div: the body.
Set it to 50% and it will be easy to tell by looking at it...
Having said that, I do remember something about IE having a
different behaviour in some cases. Like when you set a div
to be 100% wide, it will act as if it's 100% of the body,
instead of the parent element. Not sure exactly though.
--
Els
Sonhos vem. Sonhos vão. O resto é imperfeito.
- Renato Russo - | |
|
P: n/a
|
Els wrote: Els wrote:
Jeremy Collins wrote:
margin-right: 10%;
10% of what? The screen? The containing <DIV>? It's hard to tell
by looking at it...
Parent element.
In the case of margins next to the containing div: the body.
Set it to 50% and it will be easy to tell by looking at it...
Having said that, I do remember something about IE having a different
behaviour in some cases. Like when you set a div to be 100% wide, it
will act as if it's 100% of the body, instead of the parent element. Not
sure exactly though.
With li { margin-right: 50%; } Mozilla and Opera draw the text to
about half way across the containing DIV, correctly, as you say.
IE renders the li to about 25% of the containing DIV! (In a
3-column layout).
Bah. Anyway, thanks for the help.
--
jc
Remove the -not from email | |
|
P: n/a
|
Jeremy Collins wrote: Els wrote:
Els wrote:
Jeremy Collins wrote: margin-right: 10%;
10% of what? The screen? The containing <DIV>? It's hard to tell
by looking at it...
Parent element.
In the case of margins next to the containing div: the body.
Set it to 50% and it will be easy to tell by looking at it...
Having said that, I do remember something about IE having a different
behaviour in some cases. Like when you set a div to be 100% wide, it
will act as if it's 100% of the body, instead of the parent element.
Not sure exactly though.
With li { margin-right: 50%; } Mozilla and Opera draw the text to
about half way across the containing DIV, correctly, as you say.
IE renders the li to about 25% of the containing DIV! (In a
3-column layout).
So my guess is that the containing DIV is eh.... well,
anyway, 75% of the containing DIV equals 50% of the body?
(I used to be better at calculations)
Bah. Anyway, thanks for the help.
Must be a way around it, I'd say?
Some IE hack to give different percentages to IE? http://centricle.com/ref/css/filters/
--
Els
Sonhos vem. Sonhos vão. O resto é imperfeito.
- Renato Russo - | | This discussion thread is closed Replies have been disabled for this discussion. | |  Question stats - viewed: 2418
- replies: 8
- date asked: Jul 20 '05
|
