terça-feira, 28 de julho de 2015

Como colocar imagens do post com o mesmo tamanho? - Modelo Travel e Modelo Espetacular Ltda. (Blogspot)





Imagem de ⚜️Luna de Antiguedades⚜️

Bom gente.... Mudei o modelo do meu blog e vou vê se me acostumo com ele. Porem, tive uns probleminhas com o tamanho de todo o layout e principalmente nas imagens iniciais que coloco no post. Quando determinei uma largura digamos "pequena" as imagens iniciais não se adequaram. Elas ficaram passando.

Antes quando eu tinha o Modelo Travel era tudo mais simples e fácil. É recomodadíssimo para quem é iniciante ter esse modelo e você irá encontrar tutoriais a bessa


Modelo Travel/Viagem
Tentativa 1

Modelo> Editar Html > Ctrl+F e procurre por:
.main-inner .column-center-outer {
acima dele coloque o código:

.post img {
max-width: 520px;
height: auto;
}

altere o vermelho até ficar num tamanho adequado



Modelo Travel/Viagem
Tentativa 2

ModeloEditar Html Ctrl+F procurre por:

/* Posts
----------------------------------------------- */

abaixo dele coloque o código:

.post img {
max-width: 520px;
height: auto;
}

altere o vermelho até ficar num tamanho adequado


Modelo Travel/Viagem
Tentativa 3

ModeloEditar Html Ctrl+F procurre por:
]]></b:skin>
 acima dele coloque o código:

.post img {
max-width: 520px;
height: auto;
}

altere o vermelho até ficar num tamanho adequado


Modelo Espetaular Ltda
Tentativa 1

ModeloEditar Html Ctrl+F procurre por:
.post-body img {

e abaixo de todo o código:

.post-body img {
  padding: 8px;
  background: $(image.background.color);
  border: 1px solid $(image.border.color);

  -moz-box-shadow: 0 0 $(image.shadow.spread) rgba(0, 0, 0, .0);
  -webkit-box-shadow: 0 0 $(image.shadow.spread) rgba(0, 0, 0, .0);
  box-shadow: 0 0 $(image.shadow.spread) rgba(0, 0, 0, .0);

  -moz-border-radius: $(image.border.radius);
  -webkit-border-radius: $(image.border.radius);
  border-radius: $(image.border.radius);


coloque este código:

.post img {
max-width: 520px;
height: auto;
}

altere o vermelho até ficar num tamanho adequado.


Dependendo do código, neste modelo nem sempre funciona quando é colocado abaixo de
/* Posts
----------------------------------------------- */
é arriscado aumentar todaaas as imagens. Quando coloquei por essa tentativa que mostrei acima, deu super certo. É tanto que vim logo correndo fazer este post. Espero que com você também!

Beijos!

Nenhum comentário:

Postar um comentário

Olá! Obrigada pela sua visita e comentário♥

Leia também:

Subir