THIS IS A CODE I SAW written by one of the coders in u tube channel .
IN both the codes output is same
<ol>
<li>item1</li>
<li>item2 LIST TAG not closing
<ol>
<li>item3 </li>
<li>item4</li>
<li>item5 LIST TAG not closing
<ol>
<li>item6</li>
</ol>
</li>
<li>item7</li>
</ol>
</li>
</ol>
Okay i modified the org. code and closed the list tag there only where it needed to be closed
Why he did not write the second one instead of first one?
Is the first one technically wrong or
One of the problems with html (in my opinion) is that it is very forgiving of sloppy code. So it works therefore?
You (and everyone else) would find it easier to understand your code if you indented your code. Of course, itâs rather difficult when you have missing opening and/or closing tagsâŚ
YOu did not copy the first Order list tag .
WHy u create complexity by creating a new post .
see i again had to go back and paste the ol tag at the top!!!
Direct children of a ul or ol can only be li tags (or html comment tags). (In the same way that you canât have a table as a direct child of a table element. Nested tables would go inside table-cells.)
Html has strict rules to follow and even though a browser will try to error correct your bad code it doesnât make it valid. You would have found this out before posting if you had followed my advice and checked the code you post in the w3c validator before asking questions about it
Please forgive me for sounding stupid. I think that code that breaks the rules of HTML and fails the validation tests should be considered âinvalidâ. I thought that PaulOB explained the rules of valid HTML lists very well and showed both valid and invalid examples.
Post your code again (without the blank lines, please) and show us why you believe that your code is âlogicallyâ valid? I am having a problem understanding your concept of âlogicâ.
Logic doesnât really enter in to it. Rules are rules and are in place to create intelligent structures.
Itâs like spelling words any way you want. People can still guess what you mean but the words donât follow the rules of the language.
Html has a structure and a set of rules that apply to the elements you use. Just because you can get away with broken code doesnât mean you should use it. Indeed a browser is well within its rights to ignore broken code and then all bets are off.
While the specification of an LI does say you can omit the ending tag (which⌠is weird, but the specification is weird sometimes.) of an <li>, thatâs NOT what is happening here. The LI begins on line 3 (line 4 if you count the blank line) and ends on the second-to-last line of the code. It DOES close, just not on that line.
The original code has an <ol> as a child of an <li>, which is valid.
Your code has an <ol> as a sibling of an <li>, which is invalid.
Not really. Itâs more about unambiguity, if I may reason a bit.
As @PaulOB said, lists are only allowed to have list items as children (which is logical for a list). And list items can have block elements as direct children, e.g. divs and para and lists, but not another list item.
So in order to have lists working as lists, instead of breaking the rendering, a new list item will automatically close the current item and an end tag assumed (virtual inserted by the browser). So it is allowed to omit the end tag, which could be practical in case of generated content.
Another example; a paragraph is a block that canât contain or nest block elements, so when a new block is started (e.g. a new paragraph) the current paragraph is interrupted and automatically closed, its end tag is assumed and thus allowed to be omitted. This could also be practical in cases with generated content.
Personally I believe the rule that inline and block elements should not be siblings has similar reasons; to make rendering logical for the hard working browser.
thats because the validator is applying the âYou donât need a closing </li> between <li>â rule. Item2 ends at the end of the line, and then after item 4, there is a </li> that has no matching <li>.
Note that thatâs only true because items 3 and 4 were not in their own separate list.
was more about readability, if you ask me. If the goal is to make it âlogicalâ, and reduce load on the âhard working browserâ⌠youâd enforce an end tag, and that way the browser doesnât have to think about âdo i need to forcibly insert an end tag here to make it make senseâ⌠just my view, though.
An li elementâs end tag may be omitted if the li element is immediately followed by another li element or if there is no more content in the parent element.
In fact the browser will insert that closing tag automatically for you as can be seen in devtools.
That doesnât mean that its good practice to omit them because that just makes for messy code and its hard to spot errors in messy code. There are rules to follow but there are also best practices to follow to make your coding more robust.
As I said before I would prefer that html was more strict with its format but it does have a formal set of rules that it follows.
actually backslash not given - this was a comment .
I saw in dev tools . Yes the html parser is automatically inserting a backslash in the closing tag of li of item Oranges and then creating another data item which is no 4 with a blank data item.
It is doing one extra thing . It should not be creating another li item but i think thats the way html parser makes sense of sloppy code.