Boa tarde, estou treinando os aprendizados do curso mas estou com um problema e ainda não consegui arrumar, a página esta com uma parte branca no lado direito, com posso ajeitar isto ?
Você está vendo a versão anterior da nova experiência da Alura que estamos preparando para você. Em breve, ela ganha uma identidade visual novinha totalmente pensada em potencializar seus estudos!
Boa tarde, estou treinando os aprendizados do curso mas estou com um problema e ainda não consegui arrumar, a página esta com uma parte branca no lado direito, com posso ajeitar isto ?
Boa tarde, jackson em vez de fazer com o position relative, você poderia começar a utilizar o postion flex, tem um curso aqui sobre isso, dá uma olhada, dessa forma vai facilitar bastante a sua vida na hora da criação de sites.
Não funcionou
E dae guri da terra dos monarcas! Tudo certo?
Olhando aqui , não aparece para mim esta parte branca do lado direito. Para mim apareceu normal. Ou eu não consegui identificar onde está o que se você se refere. Caso queira, me envie o print da tela ( angelico100@gmail.com ) para que eu possa tentar auxiliá-lo.
Opa, isso mesmo haah, estou te enviando 2 prints para você analizar
Olá Jackson, tudo certo?
Acredito que o erro se dê pelo fato de não se ter um 'class=container' em todas as sections. Talvez se você criar uma tag main com class=container e colocar todas as sections lá ajude.
Opa.. consegui identificar o que você está falando.. e a questão é a seguinte.. não é pelo fato de não estar em um class="container", e sim, porque existem itens do seu site que estão em uma div e que estão dentro de um class="container"
Como seu style "container" é de um tamanho de 1170px, as divs internas também ficam com este tamanho, expandindo sua tela e ficando o espaço em branco.
Um exemplo do que falo é sua div "icon-social", que está dentro de uma div "container", que também está dentro de uma div "container".
Notei que isto só esta acontecendo no seu header:
<nav class="navbar navbar-default">
<div class="container">
<div class="navbar-header">
<button class="navbar-toggle collapsed" aria-expanded="false" type="button" data-target="#collapse-navbar" data-toggle="collapse">
<span class="sr-only">Toggle navigation</span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</button>
<a class="navbar-brand" href="#">CURRÍCULO</a>
</div>
<div class="collapse navbar-collapse" id="collapse-navbar">
<ul class="nav navbar-nav">
<li>
<a href="#universidade">UNIVERSIDADE</a>
</li>
<li>
<a href="#mini-cursos">MINICURSOS</a>
</li>
<li>
<a href="#id-competencia">STARTUPS</a>
</li>
<li>
<a href="#video-trabalho">PROJETOS TRABALHADOS</a>
</li>
<li>
<a href="#contato">CONTATO</a>
</li>
</ul>
</div>
</div>
</nav><div class="topcasafina-banner">
<div class="container">
<div class="row">
<div class="col-lg-6">
<img class="foto-perfil" alt="Foto de perfil do Jackson Felipe Magnabosco" src="assets/img/perfil.png">
</div>
<div class="col-lg-6">
<h1 class="titulo-nome">JACKSON FELIPE MAGNABOSCO</h1>
<p class="legenda-titulo">Graduando em Ciência da Computação pela
<abbr title="Universidade Regional Integrada do Alto Uruguai e das Missões Erechim">URI-Erechim,</abbr>
com o objetivo de se desenvolver como profissional na área de tecnologia da informação,
ajudando a empresa a maximizar
seus resultados através de estudo, dedicação, pesquisa e inovação. </p>
<div class="container">
<div class="icon-social">
<a href="https://github.com/jacksonn455" target="_blank">
<img width="100" height="100" class="icon-image" alt="W3Schools" src="assets/img/Github-icon.png" border="0">
</a>
<a href="https://www.linkedin.com/in/jackson-felipe-magnabosco-b0a48798/" target="_blank">
<img width="100" height="100" class="icon-image" alt="W3Schools" src="assets/img/Linkedin-Icon.png" border="0">
</a>
<a href="https://www.instagram.com/jacksonn455/" target="_blank">
<img width="100" height="100" class="icon-image" alt="W3Schools" src="assets/img/instagram-icon.png" border="0">
</a>
</div>
</div>
</div>
</div>
</div>
</div>
</header>
Acho que é justamente esse o erro. De acordo com a documentação do bootstrap você deve evitar aninhar a classe container pelo fato delas terem um padding. Tenta tirar o container do icon social e vê no que dá.
Entendi que a ideia é ter um "container" para cada item da pagina. Até aí não vejo problema. O problema acontece quando há o container dentro do container.
Perfeito era isso mesmo, estava um container dentro do outro. obrigado pelas informações