| SitePoint Sponsor |
|
|
User Tag List
Results 1 to 3 of 3
-
Feb 8, 2008, 12:45 #1Afraid I can't do that Dave
- Join Date
- Mar 2004
- Location
- East Anglia, England.
- Posts
- 640
- Mentioned
- 0 Post(s)
- Tagged
- 0 Thread(s)
Large font size and list-style-position: inside: incorrect spacing
Hey there,
This is a simple problem, code can illustrate the clearest:
On Firefox it inserts spacing after the numbers, on IE (6--and 7 I believe) the number and the list item runs into each other.Code:<html> <head> <style> ol { margin 0; padding: 0; list-style-position: inside; font-size: 2.6em; } li { margin: 0; padding: 0; } cite { margin: 0; padding: 0; } </style> </head> <body> <ol> <li><cite>Foo</cite></li> </ol> </body> </html>
I know I could wrap Foo in a container and give that spacing, but then I would also need to use conditional includes, as there will be too much spacing for Firefox.
Are there any fixes?
Edit:
To that point, is there any way to control the spacing between the number and the list item in Firefox?
Cheers.Last edited by Hal9k; Feb 8, 2008 at 13:20.
-
Feb 8, 2008, 14:12 #2The CSS Clinic is open
- Join Date
- Jan 2003
- Location
- Hampshire UK
- Posts
- 39,586
- Mentioned
- 153 Post(s)
- Tagged
- 3 Thread(s)
Hi,
I'm afraid that the space between the bullet and the content is completely controlled by the browser and there's nothing you can do to change it. The amount of space isn't defined in the specs so its up to the UA to decide which accounts for the differences.
You will have to add some padding to the inner element as you suggested which I know is a bit of a pain.
-
Feb 9, 2008, 09:34 #3Afraid I can't do that Dave
- Join Date
- Mar 2004
- Location
- East Anglia, England.
- Posts
- 640
- Mentioned
- 0 Post(s)
- Tagged
- 0 Thread(s)
Thanks for replying Paul.
Originally Posted by Paul O'B
It's a shame that I have basically finished a design without using one hack, but now I'll need a conditional stylesheet.
Bookmarks