Hallo, ich suche schon den ganzen Abend nach einer Lösung.
Ich möchte gerne das bei mir alles immer in der Mitte angezeigt wird.
HTML Code
[HTML]
<meta http-equiv="content-type" content="text/html; charset=ISO-8859-1" />
<meta name="description" content="" />
<meta name="author" content="Nerdy - enchantedBeer" />
<meta name="keywords" content="" />
<link href="style.css" type="text/css" rel="stylesheet" />
</div>
<div class="content">
<div class="clanbox">
clan
</div>
<div class="altisbox">
<img src="img/altis.png" alt="altis">
</div>
<div class="epochbox">
epoch
</div>
</div>
<div class="footer">
© 2015 Nerdy • www.enchantedlife.de
</div>
</div>
[/HTML]
CSS
[HTML]body {
position: static;
background-color: #312f31;
text-align: center;
color: #fdfbff;
width: 1920px;
height: 1080px;
font-family: arial;
display: block;
margin-left: auto;
margin-right: auto;
}
.header {
width: 1080px;
height: auto;
float: top;
}
.header_title {
text-align: left;
color: #b7b7b7;
}
.sub_title {
text-align: left;
color: #777777;
margin-top: -20px;
}
.content {
padding-top: 80px;
}
.header_social {
float: right;
margin-top: -45px;
text-align: right;
}
.fb {
width: 60px;
height: 60px;
float: left;
margin-left: 15px;
background-image: url(‚img/ts.png‘);
display:block;
}
.fb:hover {
background-image: url(‚img/tshover.png‘);
}
.twitter {
width: 60px;
height: 60px;
float: left;
margin-left: 15px;
background-image: url(‚img/twitter.png‘);
display:block;
}
.twitter:hover {
background-image: url(‚img/twitterhover.png‘);
}
.twitch {
width: 60px;
height: 60px;
float: left;
margin-left: 15px;
background-image: url(‚img/twitch.png‘);
display:block;
}
.twitch:hover {
background-image: url(‚img/twitchhover.png‘);
}
.yt {
width: 60px;
height: 60px;
float: left;
margin-left: 15px;
background-image: url(‚img/yt.png‘);
display:block;
}
.yt:hover {
background-image: url(‚img/ythover.png‘);
}
div.clanbox {
width: 300px;
height: 500px;
margin-right: 90px;
background-color: #5e5c5f;
float: left;
border: 1px solid #727272;
box-shadow: 0px 0px 20px #000000;
padding: 10px;
}
div.clanbox:hover {
-moz-box-shadow: 0 0 60px rgba(0,0,0,1);
-webkit-box-shadow: 0 0 60px rgba(0,0,0,1);
box-shadow: 0 0 60px rgba(0,0,0,1);
}
div.altisbox {
width: 300px;
height: 500px;
margin-right: 90px;
background-color: #5e5c5f;
float: left;
border: 1px solid #727272;
box-shadow: 0px 0px 20px #000000;
padding: 10px;
}
div.altisbox:hover {
-moz-box-shadow: 0 0 60px rgba(0,0,0,1);
-webkit-box-shadow: 0 0 60px rgba(0,0,0,1);
box-shadow: 0 0 60px rgba(0,0,0,1);
}
div.epochbox {
width: 300px;
height: 500px;
margin-right: 90px;
background-color: #5e5c5f;
float: left;
border: 1px solid #727272;
box-shadow: 0px 0px 20px #000000;
padding: 10px;
}
div.epochbox:hover {
-moz-box-shadow: 0 0 60px rgba(0,0,0,1);
-webkit-box-shadow: 0 0 60px rgba(0,0,0,1);
box-shadow: 0 0 60px rgba(0,0,0,1);
}
.footer {
color: #4d4b4e;
margin-top: 30px;
width: 1080px;
height: 100px;
float: left;
}[/HTML]