Numbers

Lesson 8 of 16 in Coddy's Instagram Page Clone | Front-End Project course.

We are moving on to the infoMid part of our profileInfo section, so this is the middle row of the whole section, here we need to write the number of posts, followers and following we have

Challenge

Easy

Inside the infoMid div add three paragraphs
In the first write {number} posts, in the specific profile we are creating there are 3 posts
In the second write {number} followers, the zimbakovtech profile has 110 followers
Finally, write {number} following, in the specific example, we have 35 following

Recommendation: Use <i><b>text</b></i> to give the numbers a bold style so they look better

Try it yourself

<!DOCTYPE html>
<html>
<head>
    <title>Instagram</title>
    <link rel="stylesheet" href="styles.css">
</head>
    <body>
        <div id="background">
            <section id="profileInfo">
                <div id="left">
                    <img alt="Profile Picture" src="https://firebasestorage.googleapis.com/v0/b/coddy-for-creators.appspot.com/o/courses%2FX5ybxTVELN2Bvmegdcgl%2FB1W4ovz1wpFwKXcrZmzV%2Finjected_t0?alt=media&token=799f5980-a8c4-43a6-82ca-1f8ba57a360f">
                    <h2 id="username">zimbakovtech</h2>
                </div>
                <div id="right">
                    <div id="userTop">
                        <div class="button" id="follow">Follow</div>
                        <div class="button">Message</div>
                        <div class="button"><img src="https://firebasestorage.googleapis.com/v0/b/coddy-for-creators.appspot.com/o/courses%2FX5ybxTVELN2Bvmegdcgl%2FYGTvUtASn8CI5DiXWvFs%2Finjected_t0?alt=media&token=631ebb8f-3a01-4dec-b525-8a7460661676" alt="Add"></div>
                        <img id="more" src="https://firebasestorage.googleapis.com/v0/b/coddy-for-creators.appspot.com/o/courses%2FX5ybxTVELN2Bvmegdcgl%2FYGTvUtASn8CI5DiXWvFs%2Finjected_t1?alt=media&token=351f4b48-6f68-4cd7-83c3-0c7f67bed30b" alt="more">
                    </div>
                    <div id="infoMid"></div>
                    <div id="bioBot"></div>                    
                </div>
            </section>
            <section id="posts"></section>
        </div>
    </body>
</html>