Jump to content
Kaio Kdesigner

Imagem destacada distorcida

Recommended Posts

Oi Pessoal!

 

Estou editando um tema, e ai as imagens dos thumbsnails estão ficando distorcidas.

 

Cada categoria tem um tamanho diferente de imagem, mas ai elas ficam destorcidas dentro do tamanho (meio confuso né?)

 

ta ficando assim: https://screenshot.net/gxvqc9y

 

Como que faço para colocar a imagem dentro do tamanho, ex: 150x150, sem q ela fique distorcida??

Share this post


Link to post
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now

  • Similar Content

    • By leonardorafaeldev
      Boa noite pessoal estou com um problema que o icone do meu site não aparece no mobile segue uma foto do problema o meu codigo esta assim
       
      <!-- icones -->   <link href="icones/favicon.ico" rel="icon">   <link href="icones/favicon.ico" rel="shortcut icon">    <link rel="apple-touch-icon" sizes="57x57" href="icones/apple-icon-57x57.png">   <link rel="apple-touch-icon" sizes="60x60" href="icones/apple-icon-60x60.png">   <link rel="apple-touch-icon" sizes="72x72" href="icones/apple-icon-72x72.png">   <link rel="apple-touch-icon" sizes="76x76" href="icones/apple-icon-76x76.png">   <link rel="apple-touch-icon" sizes="114x114" href="icones/apple-icon-114x114.png">   <link rel="apple-touch-icon" sizes="120x120" href="icones/apple-icon-120x120.png">   <link rel="apple-touch-icon" sizes="144x144" href="icones/apple-icon-144x144.png">   <link rel="apple-touch-icon" sizes="152x152" href="icones/apple-icon-152x152.png">   <link rel="apple-touch-icon" sizes="180x180" href="icones/apple-icon-180x180.png">   <link rel="icon" type="image/png" sizes="192x192"  href="icones/android-icon-192x192.png" >   <link rel="icon" type="image/png" sizes="36x36" href="icones/android-icon-36x36.png">   <link rel="icon" type="image/png" sizes="48x48" href="icones/android-icon-48x48.png">   <link rel="icon" type="image/png" sizes="96x96" href="icones/android-icon-96x96.png">   <link rel="icon" type="image/png" sizes="144x144" href="icones/android-icon-144x144.png">   <link rel="icon" type="image/png" sizes="72x72" href="icones/android-icon-72x72.png">   <link rel="icon" type="image/png" sizes="32x32" href="icones/favicon-32x32.png">   <link rel="icon" type="image/png" sizes="96x96" href="icones/favicon-96x96.png">   <link rel="icon" type="image/png" sizes="16x16" href="icones/favicon-16x16.png">   <link rel="manifest" href="icones/manifest.json">   <meta name="msapplication-TileColor" content="#ffffff">   <meta name="msapplication-TileImage" content="icones/ms-icon-144x144.png">   <meta name="theme-color" content="#ffffff">   <meta charset="utf-8">   <meta content="width=device-width, initial-scale=1.0" name="viewport">
    • By Vanessa Andrade
      Bom dia Pessoal!
       Gostaria da ajuda de vocês, não tenho conhecimento aprofundado em html e css e a tray não quer me dar suporte para alteração desta fonte dizendo que é padrão.....
      Enfim a fonte está minuscula mal dá para entender o que está escrito, e não acho onde altero...
      https://www.lacee.com.br/loja/extra.php?loja=495949&amp;pagina=afiliados
       

    • By LuizH.M
      Estou tentando alterar um css via javascript mas por algum motivo da erro
      se puder ajudar agradeço
       
      html
      <!DOCTYPE html>
      <html lang="pt-br">
      <head>
          <!--Titulo-->
          <title>Projeto</title>
          <!--Cadeia de caracteres-->
          <meta charset="utf-8">
          <meta name="viewport" content="width=device-width, initial-scale=1.0">
          <meta http-equiv="X-UA-compatible" content="ei=edge">
          <link rel="stylesheet" type="text/css" href="css/estilo.css">
          
      </head>
      <body>
          <header></header>
          <input type="checkbox" id="chk" onclick="chk()">
          <label for="chk" class="menu-chk">&#9776;</label>
          <div class="bg"></div>
          <nav class="menu" id="principal">
              <ul>
                  <li><a href="#" class="home">Home</a></li>
                  <li><a href="#">Contato</a></li>
                  <li><a href="#">Forum</a></li>
                  <li><a href="#">Sobre</a></li>
              </ul>
              
          </nav>
          <footer>
                <script type="text/javascript" src="js/javascript.js"></script>
          </footer>
      </body>
      </html>
       
      css
      *{
          padding: 0;
          margin: 0;
      }
      header{
          position: fixed;
          top: 0;
          left: 0;
          height: 50px;
          width: 100%;
          background-color: #5b859a;
      }
      .menu-chk{
          position: fixed;
          font-size: 25px;
          font-weight: bold;
          padding: 5px;
          width: 40px;
          height: 40px;
          text-align: center;
          background-color: #5b859a;
          color: #fff;
          cursor: pointer;
          transition: all.4s;
          left: 301px;
          top: 0;
      }
      .menu-chk:hover{
          background-color: #fff;
          color: #5b859a;
      }
      .menu{
          height: 100%;
          position: fixed;
          background-color: #222;
          top: 0;
          overflow: hidden;
          transition: all .4s;
      }
      #principal{
          width: 300px;
          left: -300px;
      }
      ul{
          list-style: none;
      }
      ul li a{
          display: block;
          font-size: 18px;
          font-family: 'Arial';
          padding: 10px;
          border-bottom: solid 1px #000;
          color: #ccc;
          text-decoration: none;
          transition: all.4s;
      }
      ul li span{
          float: right;
          padding-right: 10px;
      }
      ul li a:hover{
          background-color: #5b859a;
      }
      .home{
          margin-top: 60px;
          background-color: #111;
          border-left: solid 5px #444;
      }
       
      js
       
      function chk() {
          var chk = document.getElementById('chk');
          var menu = document.getElementById('principal');
          
          chk.is(':checked'){
              menu.style.left = "300px";
          }
      }
    • By jvb
      Olá povo do código, eu confesso que estou sem saber o pq de algumas propriedades do Bootstrap 4.2.1 como por exemplo:
      .img-fluid { max-width:100%; height: auto } não funcionar em outra folha de style, que não seja Bootstrap, a propriedade não esta dentro de @media, essa propriedade eu imaginava ser de uso geral.
      Vejamos que a Página continua linkando para o bootstrap, apenas algumas propriedades não terem efeito em outra folha de styles. 
    • By Sapinn
      Fala galera tudo beleza? Então alguém sabe como adicionar e remover campos de texto com js. Tipo teria um botão com um + "mais" para adicionar novos campos e junto a estes campos teria um ícone com um lixeira para remover, toda vez que fosse clicado nesse ícone o campo seria removido, apenas aquele campo. Encontrei um código para adicionar um campo mas a parte de remover ta dando dor de cabeça
      <!DOCTYPE html> <html lang="pt-br"> <head>     <meta charset="UTF-8">     <meta http-equiv="X-UA-Compatible" content="IE=edge">     <meta name="viewport" content="width=device-width, initial-scale=1.0">     <title>Pagina</title>     <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap-icons@1.5.0/font/bootstrap-icons.css"> </head> <body>     <form id="myForm">         <div id="lines"></div>         <button type="button" onclick="addInput('lines')">+</button>         <input type="submit" value="Enviar">       </form>             <script>           var formLine = 1;                 function addInput(divName) {                 var newdiv = document.createElement('div');                 newdiv.innerHTML += '<input type="text" name="produto" id='+formLine+'>';                 newdiv.innerHTML += ' <i class="bi bi-trash-fill"></i>';                 document.getElementById(divName).appendChild(newdiv);                 formLine++;             }         addInput('lines');       </script> </body> </html>  
×

Important Information

Ao usar o fórum, você concorda com nossos Terms of Use.