<del> and <ins> in lists
While working on some examples to demonstrate <ins> and <del> with a document history viewer I came across an unexpected problem. If you want to remove or insert a whole list item, you can’t wrap it in <del> or <ins> as <ul> and <ol> only allows <li> children.
Putting <del> inside the <li> makes the browsers render the list item as it was empty but with the bullet, leaving an undesired result if you have set del { display: hidden; }.
This appears to be a case where the specifications haven’t taken into account every option. If you remove a list item at some point and would like to mark that up in your HTML document then you want to mark up the entire list item, including the <li> tag, not just it content.
Fortunately, it looks like all browsers will render <del><li>Lorem Ipsum</li></del> as I want, removing the entire list item including the bullet. This is invalid markup according to the specifications, but I think that this is a good example of where you can ignore that.
I posted a comment about this in the public W3C HTML news group. Hoping that it’d be added to the HTML5 specifications. So far there’s no response.
Comments
No comments
Archived Posts:
Subscribe to this Blog:
Labels:
- accessibility
- animation
- background-image
- barcelona
- career
- changelog
- christmas
- code
- colour
- com
- css
- deardiary
- del
- desktopx
- documentation
- dom
- england
- events
- film
- fun
- gadget
- games
- gestures
- halloween
- html
- ie
- innerhtml
- ins
- javacript
- keyboard
- life
- list-style-image
- lists
- london
- modelmaking
- moving
- msn
- paintball
- php
- pingback
- pixar
- printer
- product
- scanner
- scheme
- scripting
- semantic
- server
- sidebar
- skype
- snow
- software
- split()
- test
- travel
- underground
- userinterface
- vista
- voip
- w3c
- webdesign
- website
- whitespace