HeyHo, i´m trying to make a responsive Webside where the "head" "nav" "footer" is in normal alignment (left) and the "section" [the thing with the Green and Blue color] is in the center. The Code: [I think when i show the whole code, then you can retrace it better.]
@import url("font-awesome.min.css");
@import url("http://ift.tt/1bSiS9T");
@import url("http://ift.tt/OIiP2w");
header, nav, aside, section, footer
{
display: block;
}
body
{
font-family: 'Open Sans', sans-serif;
background: #f0f0f0;
font-weight: 300;
}
header
{
background-color:yellow;
}
nav
{
background-color:orange;
}
section
{
background-color:yellowgreen;
width: 80%;
display: inline-block;
}
footer
{
background-color:deepskyblue;
}
article
{
background-color:red;
}
aside
{
background-color:blue;
width: 20%;
float: right;
}
#mid
{
margin: 0 auto;
}
<!DOCTYPE html>
<html>
<head>
<title>The Title</title>
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="stylesheet" href="style.css">
<script>
document.createElement("header");
document.createElement("nav");
document.createElement("aside");
document.createElement("section");
document.createElement("footer");
</script>
</head>
<body>
<header>
I´m the Header
</header>
<nav>
Navigation
</nav>
<section id="mid">
<aside>
The Sidebar
</aside>
<p>Text!</p>
<p>2nd Text</p>
</section>
<footer>
© Unknown | Desing: ME
</footer>
</body>
</html>
Now. I am Trying to put the in the middle. I tried it with extra "div"´s, instead of the "section id=mid" with "class" and others. But The Text in the "section" should be "left", thats why i don´t use < "center" > I tried to search in the index of stackoverflow but nothing worked. The only thing thats moving ist the width in many times to 50%.
Can anyone reseach the fail in the code? Thanks!
Aucun commentaire:
Enregistrer un commentaire