I have an idiot question if you may, I can't find an answer for this thing;
I'm trying to code a new website at the moment, I've done the background and nothing to fear of!
Now, the text is moving the background aside! Let me show you
and what it should be , is upon the background without moving it!
The code:
HTML:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://ift.tt/mOIMeg">
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title>Evasion Online</title>
<link href="style.css" rel="stylesheet" type="text/css" />
<div id="wrapper">
<div id="header">
</div>
<div id="navigator"><!--START NAV-->
<div class="nav"><!--START NAV CLASS-->
<nav>
<ul>
<li><a href="#">Home</a></li><br>
<li><a href="#">Register</a></li><br>
<li><a href="#">Download</a></li><br>
<li><a href="#">About</a></li><br>
<li><a href="#">Shit</a></li><br>
</ul>
</nav>
</div><!--END NAV CLASS-->
</div><!--END NAV-->
<div id="nav">
</div>
<div id="leftside"><!--START LEFTSIDE-->
<div class="statistics">
</div>
<div class="rank">
</div>
</div><!--END LEFTSIDE-->
<div id="main"><!--START MAIN-->
<div class="news">
</div>
</div><!--END MAIN-->
<div id="rightside"><!--START RIGHTSIDE-->
<div class="login">
</div>
<div class="exclusive">
</div>
</div><!--END RIGHTSIDE-->
<div id="block_content">
</div>
<div id="footer">
</div>
</div>
CSS:
html, body, div, span, applet, object, iframe,h1, h2, h3, h4, h5, h6, p, blockquote, pre,a, abbr, acronym, address, big, cite, code,del, dfn, em, img, ins, kbd, q, s, samp,small, strike, strong, sub, sup, tt, var, u, i, center,dl, dt, dd, ol, ul, li,fieldset, form, label, legend,caption, tbody, tfoot, thead, th, td,article, aside, canvas, details, embed, figure, figcaption, footer, header, hgroup, menu, nav, output, ruby, section, summary,time, mark, audio, video { margin: 0; padding: 0; border: 0; font-size: 100%; font: inherit; vertical-align: baseline;}/* HTML5 display-role reset for older browsers */article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section { display: block;}body { line-height: 1;}ol, ul { list-style: none;}blockquote, q { quotes: none;}blockquote:before, blockquote:after,q:before, q:after { content: ''; content: none;}
table{
margin: 0; padding: 0; font-size: 100%; font: inherit; vertical-align: baseline;
}
/*#############*/
/*STARTING CSS*/
body{
background:url('imgs/bg.png') top center no-repeat;
height:100%;
margin: 0;
padding:0;
font-family:Tahoma;
background-repeat:no-repeat;
font-size:12px;
overflow-x:auto;
left:0;
right:0;
}
#wrapper {
width:1280px;
margin: 0 auto;
}
#header{
float: left;
background:url('imgs/header.jpg') no-repeat;
width:1280px; height:837px;
background-size: 100% 100%;
}
a {
display: block;
}
.nav{
float: left;
position: relative;
list-style-type: none;
}
.nav ul{
padding:0;
margin:0;
}
.nav li{
float: left;
margin: 0 0.15em;
}
#leftside{
float:left;
background:url('imgs/leftside.jpg') no-repeat;
width:346px; height:788px;
background-size: 100% 100%;
}
#main{
float:left;
background:url('imgs/main.jpg') no-repeat;
width:585px; height:788px;
background-size: 100% 100%;
}
#rightside{
float:left;
background:url('imgs/rightside.jpg') no-repeat;
width:349px; height:788px;
background-size: 100% 100%;
}
#footer {
float:left;
background:url('imgs/footer.jpg') no-repeat;
width:1280px; height:333px;
background-size: 100% 100%;
}
.container {
width:1280px;
margin:0 auto;
}
Aucun commentaire:
Enregistrer un commentaire