Arkadaşlar makina mühendisiyim kendimi geliştirmek adına web tasarımı öğrenmeye başladım ancak bir yerde tıkandım aldığım kursta.Liste yan yana yazdırma muhabbeti var gereken her şeyi yapıyorum ancak bir türlü yan yana olmuyor alt alta çıkıyor bir bakabilirmisiniz rica etsem? <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8" /> <meta http-equiv="X-UA-Compatible" content="IE=edge" /> <meta name="viewport" content="width=device-width, initial-scale=1.0" /> <title>Document</title> <style> * { border-sizing: border-box; } body { margin: 0; } #ustnav { background-color: rgb(96, 95, 108); } #logo { color: #fff; text-decoration: none; font-weight: bold; font-size: 21px; padding: 10px; } .navlist { display: inline-block; text-align: right; width: calc(100% - 99px); } .navelement { list-style-type: none; margin: 0; padding: 0; text-decoration: none; color: #fff; } .navelement a { text-decoration: none; color: #fff; } .navelement a:hover { color: black; } </style> </head> <body> <nav id="ustnav"> <a href="#" id="logo">MovieApp</a> <ul class="navlist"> <li class="navelement"><a href="#" class="film">Filmler</a></li> <li class="navelement"><a href="#" class="dizi">Diziler</a></li> <li class="navelement"><a href="#" class="login">Login</a></li> </ul> </nav> <header id="main__header"> <h1>Welcome to MovieApp</h1> </header> <section id="how-it-works"> <div id="enustkisim-how-it-works"> <h2>How it works?</h2> <p> Lorem ipsum dolor sit amet, consectetur adipisicing elit. Nam dolor repellendus minus doloribus tenetur accusamus? </p> </div> <div id="altuclu-how-it-works"> <h2>Register</h2> <p> Lorem ipsum dolor sit amet, consectetur adipisicing elit. Nam dolor repellendus minus doloribus tenetur accusamus? </p> <h2>Choose a plan</h2> <p> Lorem ipsum dolor sit amet, consectetur adipisicing elit. Nam dolor repellendus minus doloribus tenetur accusamus? </p> <h2>Enjoy Movies</h2> <p> Lorem ipsum dolor sit amet, consectetur adipisicing elit. Nam dolor repellendus minus doloribus tenetur accusamus? </p> </div> </section> </body> </html> |
Bildirim