Problema em template site

Boa tarde,

Estou atentar implementar bootstrap numa página estática no blogger. No entanto, quando coloco a biblioteca:
href=“https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css
A página fica totalmente alterada.

Fiz esta página de teste para verem o que acontece com o logo e a lateral do site.
Alguem me consegue ajudar a cancelar os efeitos da biblioteca no que não quero.

Página de teste: https://www.animaly.org/p/teste_29.html

Muito Obrigado,
Filipe Azevedo

Você removeu?

Sim, estava a tentar outras formas e sem querer apaguei.
Já coloquei. Não sei pq a header fica toda desconfigurada
https://www.animaly.org/p/teste_29.html

Existe alguma forma de impedir isso? Ou não posso utilizar nada da bootstrap?

Parece estar incompatível mesmo, ao reduzir o tamanho da tela fica normal, está com algum erro no redimensionamento, infelizmente não entendo muito de bootstrap pra te ajudar.

1 curtida

Ok, muito obrigado na mesma! :wink:

Bootstrap é nada mais nada menos que classes css para estilização da sua página e algumas funções JS para manipulações de elementos.

Supondo que você já tinha uma classe container em uma div sua antes de por o Bootstrap

<div class="container">
    ...
</div>

Quando você colocou o Bootstrap, ele deu algumas propriedades css para essa sua div, pois o Bootstrap tem uma classe chamada container que tem x propriedades, no qual pode acarretar problemas visuais para a sua página.

Uma possível solução é mudar o nome da classe

Ja alterei o nome mas nao resultou :pensive:

Você vai ter que ver quais classes estão tendo conflitos e ir renomeando ou então mexer mais no seu arquivo css

O que eu faria:
Abriria duas páginas no navegador, uma com o Bootstrap e outra sem e então ir inspecionando os elementos até achar a causa.

Outra coisa: Se você é novo no Bootstrap, pq não usa uma versão mais recente? Pelo menos a 4.0

1 curtida

Ok, vou fazer isso! Muito obrigado pela ajuda

Já mudei tudo o que achava e não consegui resolver! No css do bootstrap não tem os mesmos nomes das classes do meu css.
https://www.animaly.org/p/teste_29.html - Este é a minha págia de código
https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/4.3.1/css/bootstrap.min.css - Este é o css que está a causar as alterações

Tem alguma dica mais?

Obrigado

Então, eu diminuiria o tamanho da logo no header, tenta fazer isso e vê se ajuda.

Mas eu não querias alterar isso, até pq nas outras página esta perfeito assim