Using flexbox to start styling our navigation

scrimba

Watch in fullscreen

by Kevin Powell

Learn Responsive Web Design

About

Comments

Notes

Making our navigation look good7:15

Using flexbox to start styling our navigation

by Kevin Powell

Learn Responsive Web Design

Expand for more info

Making our navigation look good7:15

index.html

run

preview

console

<html>
    <head>
        <link href="https://fonts.googleapis.com/css?family=Lora|Ubuntu:400,700&display=swap" rel="stylesheet">
        <link rel="stylesheet" href="css/styles.css">
    </head>
    <body> 
        <header>
            <div class="site-title">
                <h1>Living the social life</h1>
                <p class="subtitle">A blog exploring minimalism in life</p>
            </div>
            <nav>
                <ul>
                    <li><a href="#">Home</a></li>
                    <li><a href="#">About me</a></li>
                    <li><a href="#">Recent posts</a></li>
                </ul>
            </nav>
        </header>
    </body>
</html>

<html>

<head>

rel="stylesheet">

</head>

<body>

<h1>Living the social life</h1>

<p class="subtitle">A blog exploring minimalism in life</p>

</div>

<nav>

<ul>

<li><a href="#">About me</a></li>

<li><a href="#">Recent posts</a></li>

</ul>

</nav>

</header>

</body>

</html>

-7:36