Ajuda com background, div e alinhamento
Estou organizando uma página em HTML e estou com o seguinte problema: as divs não estão ficando na posição centralizada da página e já usei os recursos que conheço, mas nenhum deles funcionou. Apenas uma div funcionou com o "text-align:center", mas tentei aplicar as mesmas características, porém, sem sucesso.
>
Citar
<style type=text/css>
.semana{
font-size:13px;
font-style:none;
letter-spacing:1px;
margin-bottom:-1px;
line-height:17px;
width:380px;
padding-top:10px;
padding-bottom:4px;
padding-left:7px;
padding-right:7px;
background:#fff;
-webkit-transition: all .5s;
text-align:center;
text-transform:lowercase;
}
.musica{
font-size:14px;
font-style:none;
letter-spacing:0.5px;
width:380px;
line-height:19px;
padding-top:0px;
padding-bottom:5px;
padding-left:7px;
padding-right:7px;
font-family: "Product Sans";
background:#fff;
-webkit-transition: all .5s;
text-align:center;
}
.album{
font-size:12px;
font-style:italic;
letter-spacing:1px;
width:380px;
padding-top:2px;
padding-left:7px;
padding-right:7px;
background:#fff;
-webkit-transition: all .5s;
text-align:center;
}
.pagina{
font-size:14px;
letter-spacing:1px;
padding-top:2px;
padding-left:7px;
width:550px;
margin-left:auto;
margin-right:auto;
font-style:none;
padding-right:7px;
background:transparent;
-webkit-transition: all .5s;
text-align:justify;
}
.sobre{
width:380px;
font-size:12px;
letter-spacing:1px;
margin-bottom:10px;
padding-top:0px;
padding-bottom:5px;
padding-left:7px;
padding-right:7px;
border-bottom:1px solid #eeeeee;
background:#fff;
color: #aaa;
-webkit-transition: all .5s;
text-align:center;
}
.fundo-et{
width:auto;
height:auto;
margin-left:auto;
margin-right:auto;
}
.esquerda-et{
font-size:13px;
background:url('https://68.media.tumblr.com/612529a9f9b4a48d181d4095b72b0bab/tumblr_olf0hkAm7Q1smrp6uo2_r6_1280.png') no-repeat, center center;
font-style:none;
letter-spacing:0px;
width:1000px;
height:auto;
padding-top:20px;
padding-bottom:20px;
padding-left:50px;
font-family: "Product Sans";
-webkit-transition: all .5s;
text-align:center;
}
.fundo-rise{
background:#919bde;
width:auto;
height:auto;
margin-left:auto;
margin-right:auto;
}
.direita-rise{
font-size:13px;
background:url('https://68.media.tumblr.com/e1f003935d218d886e342517d8ed05c5/tumblr_olf0hkAm7Q1smrp6uo1_r7_1280.png') no-repeat, center center;
font-style:none;
letter-spacing:0px;
width:1000px;
height:auto;
padding-top:20px;
padding-bottom:20px;
padding-left:570px;
font-family: "Product Sans";
-webkit-transition: all .5s;
text-align:center;
}
</style>
</head>
<body>
<div class="fundo"><center><div class="esquerda-et">
<div class="h2">Músicas com mais semanas na posição No. 1</div>
<div class="semana"><b>
10 semanas</b></div>
<div class="musica"><b>
E.T. </b>
Katy Perry e Kanye West
</div>
<div class="sobre"></div>
<div class="semana"><b>
7 semanas</b>
</div><div class="musica"><b>
DARK HORSE </b>
Katy Perry e Juicy J
</div>
<div class="sobre"></div>
<div class="semana"><b>
5 semanas</b>
</div><div class="musica"><b>
ON THE METRO</b>
Girls Aloud</div>
<div class="musica"><b>
RISE</b>
Katy Perry</div>
<div class="sobre"></div>
<div class="semana"><b>
4 semanas</b>
</div><div class="musica"><b>
BURNING DESIRE</b>
Lana Del Rey</div>
<div class="musica"><b>
YOUTH</b>
Foxes</div>
<div class="musica"><b>
BABY DON'T LIE</b>
Gwen Stefani</div>
<div class="musica"><b>
BACK TO BLACK</b>
Beyoncé e André 3000</div>
<div class="sobre"></div>
</div></center></div>
<div class="fundo"><center><div class="direita-rise">
<div class="h2">Músicas com mais semanas consecutivas na posição No. 1</div>
<div class="semana"><b>
5 semanas</b><br>15 de julho-12 de agosto de 2016
</div><div class="musica"><b>
RISE </b>
Katy Perry
</div>
<div class="sobre"></div>
<div class="semana"><b>
4 semanas</b><br>25 de dezembro de 2015-15 de janeiro de 2016
</div><div class="musica"><b>
ON THE METRO </b>
Girls Aloud
</div>
<div class="sobre"></div>
<div class="semana"><b>
3 semanas</b><br>20 de maio-3 de junho de 2011
</div><div class="musica"><b>
E.T.</b>
Katy Perry e Kanye West</div>
<div class="semana">27 de junho-11 de julho de 2014</div>
<div class="musica"><b>
YOUTH</b>
Foxes</div>
<div class="sobre"></div>
</div></center></div>
</body>
A <div> com o nome "esquerda-et" fica centralizada na página, mas a "direita-rise" e as demais não ficam. Tentei colocar ambas dentro de divs individuais, e na primeira funcionou.Discussão (3)
Carregando comentários...