Olá pessoal. Alguém pode me dá uma luz de como resolver esse problema no título. Fiz um vídeo bem curtinho, só assistir que vocês saber do que se trata. Vlw!
Link: https://www.youtube.com/watch?v=Zo02IdwsWJQ&feature=youtu.be
Solucionado
Olá pessoal. Alguém pode me dá uma luz de como resolver esse problema no título. Fiz um vídeo bem curtinho, só assistir que vocês saber do que se trata. Vlw!
Link: https://www.youtube.com/watch?v=Zo02IdwsWJQ&feature=youtu.be
hoje, com a Alura e o Google Gemini
Carlos poste o seu código HTML e CSS entra crases(`), para que eu possa vê-lo e lhe ajudar.
Provavelmente o erro esta em alguma classe HTML se não pode ser que o breakpoint do bootstrap precise de ajustes(o que eu acho pouco provável).
Fico no aguardo dos códigos.
E ai Matheus, tranquilo? Segue o código.
<!doctype html>
<html lang="pt-br">
<head>
<meta charset="utf-8">
<title>Loja Virtual</title>
<link rel="stylesheet" href="css/bootstrap.min.css">
<link rel="stylesheet" href="css/animate.css">
<meta name="viewport" content="width=device-width">
<style>
.navbar-header button{color: #fff}
.fullscreen{width: 100%}
main{padding-top: 50px}
footer{background-color: #222; color: #fff; text-align: center; padding: 1em 0;}
.navbar-form{padding-right: 2em;}
</style>
</head>
<body>
<!--header-->
<header id="home">
<nav class="navbar navbar-inverse navbar-fixed-top">
<div class="navbar-header">
<a href="#home" class="navbar-brand">Caelum</a>
<button type="button" class="navbar-toggle" data-target=".navbar-collapse" data-toggle="collapse">Menu</button>
</div>
<div class="collapse navbar-collapse">
<ul class="nav navbar-nav">
<li><a href="#novidades">Novidades</a></li>
<li><a href="#maisvendidos">Mais Vendidos</a></li>
<li><a href="#" class="dropdown-toggle" data-toggle="dropdown">Camisetas<span class="caret"></span></a>
<ul class="dropdown-menu">
<li><a href="#">Masculina</a></li>
<li><a href="#">Feminina</a></li>
<li><a href="#">Infantil</a></li>
</ul>
</li>
</ul>
<form class="navbar-form navbar-right">
<div class="form-group">
<input type="text" class="form-control" placeholder="Digite sua busca">
</div>
<input type="submit" value="Buscar" class="btn btn-default">
</form>
</div>
</nav>
</header>
<main>
<!--banner-->
<div class="container-fluid">
<div class="row">
<div id="carousel" class="carousel slide" data-ride="carousel">
<ol class="carousel-indicators">
<li data-target="#carousel" data-slide-to="0" class="active"></li>
<li data-target="#carousel" data-slide-to="1"></li>
</ol>
<div class="carousel-inner" role="listbox">
<div class="item active">
<img src="img/banner1.jpg" alt="Moda" class="fullscreen">
</div>
<div class="item">
<img src="img/banner2.jpg" alt="Moda infantil" class="fullscreen">
</div>
</div>
<a href="#carousel" class="left carousel-control" data-slide="prev"><span class="glyphicon glyphicon-chevron-left"></span></a>
<a href="#carousel" class="right carousel-control" data-slide="next"><span class="glyphicon glyphicon-chevron-right"></span></a>
</div>
</div>
</div>
<!--categorias e novidades-->
<div class="container-fluid">
<div class="row">
<div class="col-xs-12 col-sm-3">
<div>
<h3 class="text-center">Categorias</h3>
</div>
<div class="list-group">
<button type="button" class="list-group-item wow fadeInLeft" data-wow-delay=".2s"><a href="#">Camisetas Masculinas</a></button>
<button type="button" class="list-group-item wow fadeInLeft" data-wow-delay=".4s"><a href="#">Camisetas Femininas</a></button>
<button type="button" class="list-group-item wow fadeInLeft" data-wow-delay=".6s"><a href="#">Moda Verão</a></button>
<button type="button" class="list-group-item wow fadeInLeft" data-wow-delay=".8s"><a href="#">Moda Inverno</a></button>
</div>
</div>
<div class="col-xs-12 col-sm-9">
<div id="novidades">
<h3 class="text-center">Novidades</h3>
</div>
<div class="thumbnail text-center col-xs-12 col-md-4 wow fadeInRight" data-wow-dela=".2s">
<figure>
<img src="img/camisa-azul.png">
<div>
<h4>Camisa Azul Importada</h4>
<p>Camisa azul importada por um preço acessível e com tecido de qualidade</p>
</div>
</figure>
<div class="btn-group">
<a class="btn btn-default" href="#">R$ 190,00</a>
<a class="btn btn-primary" href="#">
<span class="glyphicon glyphicon-shopping-cart">
</span>
Comprar
</a>
</div>
</div>
<div class="thumbnail text-center col-xs-12 col-md-4 wow fadeInRight" data-wow-delay=".4s">
<figure>
<img src="img/camisa-rosa.png">
<div>
<h4>Camisa Rosa Argentina</h4>
<p>Camisa rosa argentina por um preço acessível e com tecido de qualidade</p>
</div>
</figure>
<div class="btn-group">
<a class="btn btn-default" href="#">R$ 210,00</a>
<a class="btn btn-primary" href="#">
<span class="glyphicon glyphicon-shopping-cart">
</span>
Comprar
</a>
</div>
</div>
<div class="thumbnail text-center col-xs-12 col-md-4 wow fadeInRight" data-wow-delay=".6s">
<figure>
<img src="img/camisa-azul.png">
<div>
<h4>Camisa Azul Nacional</h4>
<p>Camisa rosa nacional por um preço acessível e bonita</p>
</div>
</figure>
<div class="btn-group">
<a class="btn btn-default" href="#">R$ 90,00</a>
<a class="btn btn-primary" href="#">
<span class="glyphicon glyphicon-shopping-cart">
</span>
Comprar
</a>
</div>
</div>
<div id="maisvendidos">
<h3 class="text-center">Mais Vendidos</h3>
</div>
<div class="thumbnail text-center col-xs-12 col-md-4 wow fadeInRight" data-wow-dela=".2s">
<figure>
<img src="img/camisa-azul.png">
<div>
<h4>Camisa Azul Importada</h4>
<p>Camisa azul importada por um preço acessível e com tecido de qualidade</p>
</div>
</figure>
<div class="btn-group">
<a class="btn btn-default" href="#">R$ 190,00</a>
<a class="btn btn-primary" href="#">
<span class="glyphicon glyphicon-shopping-cart">
</span>
Comprar
</a>
</div>
</div>
<div class="thumbnail text-center col-xs-12 col-md-4 wow fadeInRight" data-wow-delay=".4s">
<figure>
<img src="img/camisa-rosa.png">
<div>
<h4>Camisa Rosa Argentina</h4>
<p>Camisa rosa argentina por um preço acessível e com tecido de qualidade</p>
</div>
</figure>
<div class="btn-group">
<a class="btn btn-default" href="#">R$ 210,00</a>
<a class="btn btn-primary" href="#">
<span class="glyphicon glyphicon-shopping-cart">
</span>
Comprar
</a>
</div>
</div>
<div class="thumbnail text-center col-xs-12 col-md-4 wow fadeInRight" data-wow-delay=".6s">
<figure>
<img src="img/camisa-azul.png">
<div>
<h4>Camisa Azul Nacional</h4>
<p>Camisa rosa nacional por um preço acessível e bonita</p>
</div>
</figure>
<div class="btn-group">
<a class="btn btn-default" href="#">R$ 90,00</a>
<a class="btn btn-primary" href="#">
<span class="glyphicon glyphicon-shopping-cart">
</span>
Comprar
</a>
</div>
</div>
</div>
</div>
</div>
</main>
<footer><p>Rua João de Souza 28, Osasco-SP CEP: 06240-155 <br> TEL: (11) 3020-2030<p></footer>
<script src="jquery-2.2.1.min.js" type="text/javascript"></script>
<script src="js/bootstrap.min.js" type="text/javascript"></script>
<script src="js/wow.min.js" type="text/javascript"></script>
<script>
new WOW().init();
</script>
</body>
</html>Tente mudar a seguinte parte do seu código:
<div id="maisvendidos">
<div class="row">
<div class="col-xs-12 col-sm-12 col-md-12 col-lg-12">
<h3 class="text-center">Mais Vendidos</h3>
</div>
</div>
</div>Vamos ver se o problema se resolve.
Boa Matheus! Problema resolvido, vlw.
De nada Carlos, sempre que precisar não deixe de criar suas dúvidas.