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!
Solucionado
Estou com problemas em alguns lugares, com os estilos CSS. As tabelas e botoes funcionam normalmente, mas os avisos como esse :
<p class="text-success">Produto <?=$id?> removido!</p>não exibem o estilo css esperado, aparecem apenas como texto comum
e a tabela da pagina lista produtos não tem o padding no top.
Alguma ideia do motivo?
Agradeço desde ja!
Olá Raphael,
Você poderia postar o código do seu cabeçalho e do arquivo que são exibidas essas mensagens ?
<?php
include("cabecalho.php");
include("conecta.php");
include("banco-produto.php");
$nome = $_GET["nome"];
$preco = $_GET["preco"];
if(insereProduto($conexao, $nome, $preco)) {
?>
<p class="text-success">Produto <?= $nome; ?>, de valor R$<?= $preco; ?> adicionado.</p>
<?php
}else {
$msg = mysqli_error($conexao);
?>
<p class="text-danger">Produto <?= $nome; ?> não foi adicionado. <?= $msg; ?></p>
<?php
}
?>
<?php include("rodape.php"); ?>Cabeçalho
<html>
<head>
<meta charset="utf-8">
<title>Contact Light</title>
<link href="css/bootstrap.css" rel="stylesheet">
<link href="css/loja.css" rel="stylesheet">
</head>
<body>
<div class="navbar navbar-inverse navbar-fixed-top">
<div class="container">
<div class="navbar-header">
<a class="navbar-brand" href="index.php">Contact Light Store</a>
</div>
<div>
<ul class="nav navbar-nav">
<li><a href="produto-formulario.php">Adiciona Produto</a></li>
<li><a href="produto-lista.php">Produtos</a></li>
<li><a href="sobre.php">Sobre</a></li>
</ul>
</div>
</div>
</div>
<div class="container">
<div class="principal">Rodape
</div>
</div>
</body>
</html>Verifica se o arquivo cabecalho.php está chamando corretamento o arquivo do bootstrap.
Dessa forma:
<link href="css/bootstrap.css" rel="stylesheet">
Pra ficar mais facil vou mandar o link do github com todas as partes do codigo.
https://github.com/rCirelli/loja/commit/09ea518ba51e9854813504c1a6c34c6a320e7cb8
Utilize a opção Inspecionar elemento que possui em praticamente todos os navegadores atuais, sobre o elemento <p class="text-success">Produto <?=$id?> removido!</p> pra ver quais estilos estão sendo aplicados, se não há sobreposição de estilos ou até mesmo pra saber se os arquivos de estilo estão sendo carregados.
Essa linha
<p class="text-success">Produto <?=$id?> removido!</p>esta escrita exatamente assim no codigo, mas parece que não funciona direito. Assim como a centralização de texto e padding.
A linha que está com problema você já mostrou, o que eu quis dizer é pra você clicar com o botão direito sobre o elemento que não está aplicando o estilo (no seu caso é o Produto x removido!) e escolher a opção Inspecionar elemento.
Essa é uma ferramenta que vai te ajudar a descubrar muitos erros sozinho.
Segue abaixo um exemplo de como utilizá-lo:
Estou utilizando a versão developer do Firefox, mas será praticamente o mesmo no Chrome. Veja que no lado inferior direito está mostrando as regras de CSS que estão sendo aplicadas no botão.
Entendi, segui a dica e encontrei um erro no css. mas o codigo está igual o mostrado no curso, então não sei a causa.
https://postimg.org/image/tocm0wtxp/
EDIT:
parece que encontrei o problema... aparentemente o arquivo loja.css deveria estar dentro da pasta css (obvio) mas eu na inocencia em seguir o curso a risca não percebi isso, e isso tambem não foi dito em nenhum momento durante o curso... enfim, só mais um dos problemas desse tipo que estou tendo com a alura...
obrigado pela ajuda!
Acontece as vezes quando estamos tão acostumados a fazer algo e esquecermos de passar os detalhes ao ensinar pra alguém. Eu mesmo fazendo os cursos aqui apontei um ou outro ajuste nos exercícios. Utilize o botão Sugerir melhoria sempre que encontrar algo do tipo pra ajudar outros alunos.