HTML & CSS Social Networking Profile- 5. Lists within lists

Language Help Make & Deploy a Website
1 
<!DOCTYPE html>
<html>
	<head>
		<title>Jiin Lim</title>
	</head>
	<body>
	<img src="https://s3.amazonaws.com/codecademy-blog/assets/ninja_zpsa5dbe37a.jpg">
	My Pics
	</a>
	<p>I'm 20 years old</p>
	<p>I live in seoul</p>
    <h1> About me </h1>
	<ul>
	    <li> Interests </li>
	        <ol>
	            <li> New </li>
	            <li> Fun </li>
	            <li> Value </li>
	            <li> Cat </li>
	        </ol>
	   </li>   
	</ul>
    </body>
</html>

I don’t know what’s wrong with it. Would you help me?

2

Even I do not know how to write HTML here…

I wrote HTML but the results are shown…

3

you need to use markup:

for html code to show. What is the error message?

2 Likes
4

A few issues with the code you’ve posted:

  • You’ve not closed your img element correctly on line 7. Remember that the img element is a self-closing element. The syntax should be:
    <img src="image URL" />

  • The text My Pics is not surrounded by any HTML tags. Is it a heading, a paragraph, a link?

  • You have a closing </a> tag on line 8 but no opening <a> tag anywhere

  • You have closed the Interests li element on line 13 and then closed it again on line 20. Remember if you’re nesting lists, the nested list sits inside a list item of the enclosing list, like so :

    <ul>
        <li> List item
            <ol>
                <li> List item </li>
            </ol>
        </li>
    </ul>
  • It’s a really good idea to indent your code properly to make it readable. Use the tab key on your keyboard to tidy up the first half of your code, to end up something like:
    <!DOCTYPE html>
    <html>
        <head>
            <title></title>
        </head>
        <body>
            <h1></h1>
            <img src="image URL" />
            <p></p>
            <p></p>
            . . .

Hope that helps you out :slight_smile:

2 Likes
5

xhtml and xml syntax this is, html5 you don’t require the slash. i wouldn’t use it when i don’t have to

2 Likes
6

Yes, I know the self-closing tag is optional for void elements in HTML5, but thought it best to follow the syntax as taught in the tutorial and not add anything to further confuse the OP :slight_smile:

3 Likes
7 
Thanks a lot for your lovely answer!
But the error is shown again.

the error message is 
Oops, try again. Make sure you have at least one unordered list inside your unordered list of profile sections!

and my new code is below
'
<!DOCTYPE html>
<html>
	<head>
		<title>Jiin Lim</title>
	</head>
	<body>
	    <img src="https://s3.amazonaws.com/codecademy-blog/assets/ninja_zpsa5dbe37a.jpg"/>
	<h1>My Pics</h1>
	    <p>I'm 20 years old</p>
	    <p>I live in seoul</p>
        <h1> About me </h1>
	        <ul>
	            <li> Interests 
	                <ol>
	                    <li> New </li>
	                    <li> Fun </li>
	                    <li> Value </li>
	                    <li> Cat </li>
	                </ol>
	            </li>
	       </ul>
    </body>
</html>
'
Would you find out the problem just one more time again?
8

Of course! :slight_smile:

You just need to add another unordered list inside your existing unordered list.

Give it a go, and if you get stuck, let us know :slight_smile:

3 Likes
9

Exactly it worked! Thank you a lot !! XD

10

This topic was automatically closed 7 days after the last reply. New replies are no longer allowed.