Sherlock02

Olá, Tem algumas soluções já prontas no Codepen: 1- Com tabela: https://codepen.io/Paulie-D/pen/bpMyBQ 2- Variação do primeiro com tabela: https://codepen.io/MalcolmMcAtee/pen/XdqQeG E esse que eu acho melhor, pois é com listas: https://codepen.io/Paulie-D/pen/xVjNZO/ Obs.: Não sei qual curso você fez, mas html e css é complicado no começo, mesmo sendo uma linguagem simples, mas o ideal é aprender na prática mesmo. Levei quase um ano para pegar o jeitinho, mas comecei com o básico (caixas simples no blogger e personalizando listas, quotes, etc.), para depois ir avançando. Muita coisa você vai encontrar nesses sites: https://www.maujor.com https://www.w3schools.com (inglês) https://developer.mozilla.org/pt-BR/docs/Aprender E principalmente procure códigos no Codepen (só que é em inglês apenas). Lá tem muita coisa boa. Abraços e bons estudos!

Que bom que conseguiu! Abraços!

Olá, Teria como você tirar um print de como está no seu site de testes e outra imagem representando o que você gostaria de fazer? Porque se você realmente tentar deixar o footer fixed, é impossível ele não invadir, porque é como colocar um menu fixo no topo. A função dele é ficar sobre qualquer outro elemento da página. Agora você diz que o flip invade o rodapé, e não o rodapé que invade o flip, e no exemplo que te enviei isso não acontece. Cada um está em seu próprio bloco.

Olá, Segue: .photo-effect img { border: 4px solid transparent; -webkit-border-radius:80px; -moz-border-radius:80px; border-radius:80px; } .photo-effect img:hover { border: 4px solid #777; } <div class="photo-effect"> <img class="effect" src="https://source.unsplash.com//WNoLnJo7tS8/100x100"> </div> Resultado: https://jsfiddle.net/du6oLjre. Caso prefira, aplica um efeito transition para deixá-lo mais suave. Abraços!

Olá, Eu não entendi exatamente o que você quis dizer, porque basta trocar o código por width: 100%. .container{ width: 100%; height: 450px; margin: 0 auto; display: block; position: relative; background: gray; } Aqui está o exemplo do código trocando somente o width de pixels para porcentagem ocupando a largura total, e ainda acrescentei um header, só para você ver como ficaria: Redimensione a tela para ver a versão mobile e desktop. https://jsfiddle.net/7s40zkja O único "problema" do seu código é ter colocado um footer fixo (na verdade não é um problema, só é estranho). Eu pensei que fosse sua preferência, mas agora acho que entendi que é a isso que você estava se referindo. Substitua esse código: footer{ position: fixed; bottom: 0px; width: 100%; background: #111; } Por esse: footer{ position: relative; bottom: 0px; width: 100%; background: #111; } E o resultado será esse: https://jsfiddle.net/x4tfv98m Seria isso o que você precisava?

Olá, Basta acrescentar uma div "container" com o tamanho que deseja e o position relative. <div class="container"> <center> <div class="flip-container"> <div class="flipper"> <div class="front"> <img src="https://d3mwk3f7r8fv9u.cloudfront.net/images/zohO24tyN2WB8etR3nhZPvhf.png" /> </div> <div class="back"> <img src="https://d3mwk3f7r8fv9u.cloudfront.net/images/XkAkTVqVPbLB3cK5njqdun66.png" /> </div> </div> </div> </center> </div><!-- container relative --> .container{ width: 500px; max-width: 100%; height: 450px; margin: 0 auto; display: block; position: relative; background: gray; } O position absolute tem que ficar dentro do relative. Isso acontece porque o "absoluto" precisa de um ponto de referência. Aqui tem a explicação: https://tableless.com.br/propriedade-position-do-css. Abraços!

Olá, O professor pediu especificamente para você "PUBLICAR" o site? Ou simplesmente fazer? São coisas totalmente diferentes e eu creio que ele não queira o site publicado, pois, caso contrário ele teria que ter orientado como e onde fazê-lo. Falhou na orientação para os alunos. Você pode criar um arquivo HTML offline mesmo (nomedoseuprojeto.html) e inserir a estrutura normal de um site. Se você precisar publicá-lo, teria que ser opções gratuitas e é praticamente impossível encontrar algo de qualidade (tem a Hostinger seu eu não me engano, que é free, mas é tão ruim que nem de graça eu recomendaria usar). E ainda as opções blogger e tumblr (que também exigem conhecimentos e tags específicas do site deles e já fugiria do padrão html). Boa sorte.

Olá, Você colocou no tópico HTML e CSS, marcou a tag PHP e comentou que é mysql. Fica difícil saber o que deseja. Mas se for HTML e CSS, que é onde você colocou o tópico, basta usar esse código: <div class="container"> <table> <tr> <th>Segunda-feira</th> <th>Terça-feira</th> <th>Quarta-feira</th> <th>Quinta-feira</th> <th>Sexta-feira</th> <th>Sábado</th> <th>Domingo</th> </tr> <tr> <td>Cachaça</td> <td>Andrea Nunes</td> <td>Carlos Maia</td> <td>Nome Cliente quinta-feira</td> <td>Nome Cliente sexta-feira</td> <td>Nome Cliente sábado</td> <td>Nome Cliente domingo</td> </tr> <tr> <td>12h50 até 13h25</td> <td>11h até 14h</td> <td>15h até 18h</td> <td>Horário Cliente quinta-feira</td> <td>Horário Cliente sexta-feira</td> <td>Horário Cliente sábado</td> <td>Horário Cliente domingo</td> </tr> <tr> <td>Linha 3 - Segunda-feira</td> <td>Linha 3 - Terça-feira</td> <td>Linha 3 - Quarta-feira</td> <td>Linha 3 - Quinta-feira</td> <td>Linha 3 - Sexta-feira</td> <td>Linha 3 - Sábado</td> <td>Linha 3 - Domingo</td> </tr> </table> </div> E o css básico: .container{max-width:100%;width:800px;} table { width: 100%; border-collapse: collapse; } td, th { border: 1px solid #ccc; text-align: left; padding: 5px; } Resultado fica assim: https://jsfiddle.net/rgb6mtv Abraços

Olá Rebeca, O erro 404 é sobre permissão. Ou o arquivo não existe ou o endereço está incorreto. Mas você disse que isso já foi corrigido. Será que você corrigiu e apagou algum endereço necessário para o seu select funcionar? Tipo: <script src=".../jquery/meujs.js"></script> Também percebi que você uma aspa e depois, duas aspas no código. Tente alterar isso, colocando sempre duas aspas. Às vezes pode ser um errinho bobo. <div class="col s3"> <select name="tipo" class="browser-default"> <option value="" disabled selected>Tipo</option> <option value="Casa" class="tipo">Casa</option> <option value="Apartamento" class="tipo">Apartamento</option> <option>Sobrado</option> <option>Edicula</option> <option>KitNet</option> <option>Flat</option> <option>Sala Comercial</option> <option>Loja</option> <option>Galpão</option> <option>Terreno</option> <option>Fazenda</option> </select> </div>

Olá, A boa notícia é que dá para fazer, mas a ruim, é que não com css hehe Eu encontrei soluções semelhantes: (Não sei se pelas regras do forum pode ser colocado links externos aqui, mas enfim) https://pt.stackoverflow.com/questions/246777/css-ao-clicar-em-um-checkbox-pintar-uma-td E essa também: https://codepen.io/diegobdev/pen/vGoqKW Abraços!

Olá, Assim fica um pouco complicado. Seria possível você colocar o código da tabela em questão? E o css?

Olá! Bem, seu site não está carregando então não dá para ver o que está errado. Seria mais fácil se você inserisse os códigos referidos no tópico. Não sei exatamente qual modelo você usa como base no blogger, mas tente retirar toda a margem primeiro no código responsivo. Algo mais ou menos assim: #outer-wrapper { margin:0 auto; padding:0 } #content-wrapper { width:1040px; max-width: 100%; margin:0 auto; padding:0 } @media screen and (max-width: 768px){ seu codigo responsivo }

Funcionou perfeitamente. Muito obrigada!

Olá! Eu gostaria de remover o texto dos links utilizando javascript. <div id='social' class='social section'> <li><a href='http://instagram.com'>Facebook</a></li> <li><a href='http://facebook.com'>Facebook</a></li> </div> Não é possível remover o texto manualmente, pois estou falando da plataforma blogger, e por padrão ele insere o texto. Eu gostaria que ficasse apenas: <div id='social' class='social section'> <li><a href='http://instagram.com'></a></li> <li><a href='http://facebook.com'></a></li> </div> Obrigada.

Olá, Disponha! Não, nesse caso você deve indicar o que deseja no css. Segue o código: Onde era: ol > li:before { content: counter(list) ") "; counter-increment: list; } Você acrescenta ", lower-alpha" Ficando: ol > li:before { content: counter(list, lower-alpha) ") "; counter-increment: list; } Se eu quiser números romanos por exemplo, eu insiro "lower-roman" e o resultado será: i) item ii) item 2 iii) item 3 iv) item 4. Vale dar uma olhadinha nesse site: https://www.w3.org/TR/CSS2/generate.html#counters