I’m learning html Nowdays and i am not able to understand this what's the mistake i am doing- when i am entering my code it is giving output INSTRUCTIONS Create an <h1> heading called ‘Some random thoughts’. Create a paragraph using <p> which contains any text you like that describes your unordered list. Create an unordered list which contains a list of 4 random things. <!DOCTYPE html> <html> <head> <title>Unordered Lists</title> </head> <body> <h1>Some random thoughts</h1> <p> <ul> <li>table</li> <li>pen</li> <li>book</li> <li>bag</li> </ul> </p> </body> </html> Code (markup): can anyone suggest what's the error in code. Thanks in advance
Unfortunately, I didn't find any problem with the code. Maybe you can mention the specific problem which you faced and the editor you are using.
Did you try this? <!DOCTYPE html> <html> <head> <title>Unordered Lists</title> </head> <body> <h1>Some random thoughts</h1> <p>Some description of your unordered list</p> <ul> <li>table</li> <li>pen</li> <li>book</li> <li>bag</li> </ul> </body> </html> Code (markup):
A p element can only contain phrasing content (which are “inline” elements like span and strong). uls and ols are flow content (“block” elements like p and div). So they can't be used inside a p.
Yes, this code has an error because the <p> tag is for the paragraph so the browser can automatically add a blank line before and after the <p> tag. Your code will be executed but this is not the right way to nest the list in the <p> tag. As @qwikad.com mentioned above you can write a description or tagline for your list in the <p> tag.
What the devil makes an unordered list a grammatical paragraph. HTML tags have meanings. P is for a grammatical paragraph. A label and input are NOT a grammatical paragraph. An image all by itself is NOT a grammatical paragraph. A table of actual tabular data is NOT a grammatical paragraph. Headings and menus are NOT grammatical paragraphs. When in doubt, look it up in a decent reference like MDN's. https://developer.mozilla.org/en-US/docs/Web/HTML/Element/p And pay attention to the "permitted content" part, which in this case links to "phrasing content". https://developer.mozilla.org/en-US/docs/Web/Guide/HTML/Content_categories#phrasing_content Though... why would you think you even need that paragraph around the list in the first place? Are you making the mistake of choosing tags for their default appearance instead of what they actually mean?