Information

Sajt

1 Starta med flexbox

Vi ska få till en enkel layoute med flexbox.

Gör "container" nedadn till en flexbox med riktningen "column"?2. Se sedan till att boxanra nedan visas i nummerordning genom att bara använda CSS?

Kod 


<!DOCTYPE html>
<html lang="sv">
<head>
<meta charset="utf-8" />
<style>
	     
	</style>
	<style>
	     div {
		     background-color: red;
		     border-style: solid;
margin: 10px;
		     width: 50px;
		     height: 50px;
		     font-size: 32px;
		 } 
		 #container {
		         background-color: green;
			 width: 250px;
		         height: 250px;
			 left: 15px;
			 border-style: solid;
} 
	</style>
</head>
<body>
	<h1> Boxes </h1>
	<div id="container" >
<div id="box A" >
	     A
	 </div>
	 <div id="box B" >
	     B
	 </div>
	 <div id="box C" >
	     C
	 </div>
</div>
</body>
</html>

Du ska bara lägga till något mellan första style-tagarna.

Nyheter