I spent some time here with problems with background-image and today I'm here again with problems in these two semantics ...
Whenever I minimize the window or inspect my code, content in ASIDE jumps down and the problem is not just that. When trying to place borders on the tags, they do not fit the formatting.
I need the tags to be side by side and they are already with display:block
(A thousand excuses if I'm posting some stupid mistake or if I said bullshit, I'm completely lazy).
@charset "UTF-8";
@import url(https://fonts.googleapis.com/css?family=Libre+Baskerville);
@import url(https://fonts.googleapis.com/css?family=PT+Serif);}
/* Comportamento */
p {
text-indent: 30px;
text-align: justify;
font-family: Tahoma;
font-size: 20px;
}
div#interface {
background-image: url("_imgs/background4.jpg");
background-repeat: no-repeat;
background-size: 100%;
background-size: cover;
position: absolute;
left: 0;
right: 0;
top: 0;
bottom: 0;
overflow: auto;
padding: 3em;
}
div#fundo {
background-color: white;
box-shadow: 1px 1px 1px #606060;
}
section#corpo {
display: block;
float: left;
padding-bottom: 10px;
width: 700px;
}
aside#lateral {
display: block;
float: right;
height: 150px;
margin: -20px 0px 0px -10px;
position: relative;
}
/* Fim do Comportamento */
/*Formatação do menu */
header#cabecalho {
background: url(_imgs/logo-menor.png) no-repeat 1px 0px ;
height: 100px;
box-shadow: ;
}
header#cabecalho h1 {
font-family: 'Libre Baskerville', serif;
font-size: 30pt;
text-shadow: 2px 2px 2px rgba(255,255,255,.5);
margin-bottom: 0px;
padding: 0px;
text-indent: 110px;
}
header#cabecalho h2 {
font-family: 'PT Serif', serif;
font-size: 20pt;
color:#606060;
text-shadow: 2px 2px 2px white;
margin-top: 5px;
margin-bottom: 15px;
padding: 0px;
text-indent: 110px;
}
nav#menu {
display: block;
position: relative;
float: right;
}
div.position-menu {
position: relative;
right: 350px;
float: right;
width: 100%;
height: auto;
}
nav#menu ul {
list-style: none;
text-transform: uppercase;
}
nav#menu li {
background-color: #dddddd;
display: inline-block;
padding: 8px;
margin: 4px;
transition: 0.7s;
border-radius: 2px;
box-shadow: 0.5px 0.5px 1px #202020;
}
nav#menu a {
text-decoration: none;
color: black;
font-family: Tahoma;
}
nav#menu a:hover {
color: white;
}
nav#menu li:hover {
background-color: #606060;
}
nav#menu h1 {
display: none;
}
/* Conteúdo */
div#introducao {
background-color: rgba(240,240,240,.9);
padding: 10px;
box-shadow: 1px 1px 10px rgba(0, 0, 0, 0.6);
margin: 0 auto;
width: 100%;
}
div#introducao iframe {
margin: 0px;
margin-left: auto;
}
div#irmaos {
background-color: rgba(240,240,240,.9);
box-shadow: 1px 1px 10px rgba(0, 0, 0, 0.6);
}
div#irmaos img {
padding: 18px;
}
/* Rodapé */
#rodape {
clear: both;
border-top: 1px solid #606060;
}
div.rodape p {
font-size: 26px;
color: black;
text-shadow: 2px 1px 1px white;
}
div.rodape a:hover {
color: orange;
text-decoration: underline;
transition: .5s;
}
div.rodape a {
color: #000000;
text-decoration: none;
}<!DOCTYPE html>
<html lang="pt-br">
<head>
<link type="text/css" rel="stylesheet" href="stylesheet.css"/>
<meta charset="utf-8">
<title>The Rockstar Page</title>
</head>
<body>
<div id="interface">
<header id="cabecalho">
<hgroup>
<h1>The Rockstar Games</h1>
<h2>Fan Page</h2>
</hgroup>
<div class="position-menu">
<nav id="menu">
<h1>Menu</h1>
<ul>
<li><a href="index.html">Rockstar</a></li>
<li><a href="">Galeria de jogos</a></li>
<li><a href="">Vídeos</a></li>
<li><a href="">Download</a></li>
</ul>
</nav>
</div>
</header>
<hr>
<section id="corpo">
<div id="introducao">
<h1>Uma pequena introdução</h1>
<p>A <em>Rockstar Games</em> é uma produtora de jogos eletrônicos fundada em 1998 por dois irmãos britânicos: San Houser e Dan Houser, em NY, nos Estados Unidos. Essa ilustre e maravilhosa produtora ganhou fama por criar a série "Grand Theft Auto" (vulgo "GTA"), tal série que gerou grande polêmica e alvoroço por ser um game em mundo aberto. Sendo assim, era quase que inevitável que o jogo não contesse violência explícita, roubos, assassinatos e qualquer outro tipo de atividade ilegal.</p>
<iframe width="700" height="315" src="https://www.youtube.com/embed/N-xHcvug3WI"frameborder="0" allowfullscreen></iframe>
<p>A Rockstar é diferente das outras produtoras de jogos por um simples motivo: ela faz aquilo que nós (jogadores de jogos) queremos jogar. Mas não são só "aqueles joguinhos com história clichê" não. Eles priorisam a experiência e jogabilidade tanto quanto uma empresa por aí (não farei menções, desculpe) priorisa a experiência de um umboxing.
<p>Em Outubro de 2011, Dan Houser disse o seguinte à uma revista japonesa de videogames: "[...]Pode-se dizer que o objetivo da Rockstar é fazer com que os jogadores realmente sintam o que estamos tentando fazer."[...]Eu acho que nós justamente conseguimos porque nos não concentramos no lucro… Se nós fizermos o tipo os jogos que quer jogar, então acreditamos que as pessoas vão comprá-los."</p>
</div>
</section>
<aside id="lateral">
<div id="irmaos">
<h1>Os grandiosos da grandiosa Rockstar</h1>
<img src="_imgs/dan-houser.jpg" width="217" height="330">
<img src="_imgs/sam-houser.jpg" width="217" height="330">
</div>
</aside>
<!--Rodapé -->
<footer id="rodape">
<div class="rodape">
<p> Copyright ©<a href="http://www.rockstargames.com/" target="_blank"> Rockstar Games</a></p>
</div>
</footer>
</div>
</body>
</html>