Jump to content

bruno4away

Members
  • Content count

    11
  • Joined

  • Last visited

Community Reputation

0 Comum

About bruno4away

  1. bruno4away

    Posicionar Footer na Parte inferior do site.

    Solução Rápida: Script!!!
  2. bruno4away

    Posicionar Footer na Parte inferior do site.

    Fazendo isso ele não exibe o conteúdo de footer, não sei porquê mas o código que eu fiz, consegui fazer o footer ficar na parte de baixo mais eu encontrei outro problema, se eu adicionar no HTML: <figure> <img src="image/capa.jpg"> <figcaption>Play Go!</figcaption> </figure> E no CSS: .content figure{ position: relative; margin: 15px auto; float: left; text-align: center; padding-top: 10px; width: 640px; background-color: #AF7C7D; } .content figcaption{ color: #FFF; padding-top: 2px; padding-bottom: 5px; font-style: italic; } A página fica assim: SS! Agora vai ter outra dor de cabeça pra resolver isso!!
  3. bruno4away

    Posicionar Footer na Parte inferior do site.

    Consegui resolver o problema, faça o seguinte: - Adicione no HTML: <div class="absolute footer"> </div> - E adicione no CSS: .absolute{ position: absolute; } .footer{ background-color: #CCCCCC; min-width: 100%; height: 75px; bottom: 0; clear: both; position: inherit; }
  4. bruno4away

    Posicionar Footer na Parte inferior do site.

    Eu queria saber como fazer isso com apenas com css, sem scripts. //Edit. Tentei usar o script mais não surtiu efeito.
  5. bruno4away

    Posicionar Footer na Parte inferior do site.

    Não tem uma forma mais simples para fazer isso?
  6. bruno4away

    Posicionar Footer na Parte inferior do site.

    Eu tentei usar esse método, mas não deu certo, ele ainda deixa uma sobra de espaço para o fim, a parte de baixo do site no browser. O site ficou assim: SS Ele deveria ficar assim: SS Com o valor de "fixed" em "position", eu consigo manter ele na parte de baixo mais fica fixo, sempre exibindo o footer.
  7. Oi. Estou com uma dúvida, estou tentando posicionar o footer no fim da página na parte de baixo. O código que estou usando é esse: Exemplo HTML: <!doctype html> <html> <head> <meta charset="utf-8"> <title>Grand Theft Auto - IV</title> <link rel="stylesheet" href="css/estilo.css"> </head> <body> <div class="content"> <h1>Grand Theft Auto - IV</h1> <p><strong>Grand Theft Auto IV</strong> é o <small>quarto jogo</small> da mais famosa franquia da <em>Rockstar</em>. O jogador assume o papel de <strong>Niko Bellic</strong>, um <small>europeu</small> que vai aos <strong>Estados Unidos</strong> em busca de melhores condições de vida e a fim de deixar seu passado aparentemente negro para trás. O game se passa em <em>Liberty City</em>, que desta vez faz alusões muito mais claras à cidade de <strong>Nova Iorque</strong>; é possível ver pontos característicos do local fielmente reproduzidos, como o <em>Empire State Building</em>, a <em>Estátua da Liberdade</em> e a <em>Ponte do Brooklyn</em>. O protagonista é, aparentemente, um imigrante <small>europeu</small> que vai à cidade procurando uma nova vida.<br />Graças à engine <strong>RAGE</strong> <small>(Rockstar Advanced Game Engine)</small>, os gráficos de <strong>GTA IV</strong> são impressionantes, com efeitos de luz e sombra muito bem feitos.<br />Durante o primeiro trailer, o protagonista conta que já matou, seqüestrou e vendeu várias pessoas, pretendendo mudar de vida na nova cidade. Vindo da Rockstar, sabe-se que isso só pode ser uma grande ironia, não é mesmo?</p> <div id="around"> <dl> <dt>Classificação Etária</dt> <dd>17 Anos</dd> <dt>Desenvolvedora</dt> <dd>Rockstar North</dd> <dt>Distribuidora</dt> <dd><a href="http://www.rockstargames.com/">Rockstar Games</a></dd> </dl> </div> </div> <footer> <p>Sou eu</p> </footer> </body> </html> Exemplo CSS: body{ font-family: "Segoe UI", "Tahoma", sans-serif; background-color: #747474; height: 100%; margin: 0 auto; } h1{ color: #454545; } p{ margin: auto; background-color: #C9C9C9; color: #464646; padding: 10px; border: 3px solid #DDDDDD; text-align: justify; } dl{ background: #6F2F31; width: 200px; padding: 10px; border: 10px #FFFFFF dashed; } dt{ color: #FFF; margin: auto; } dd{ color: #B5B5B5; } footer{ position: inherit; bottom: 0; display: block; width: 100%; clear: both; } .content{ min-height: 100%; margin: 15px; } #around{ height: 100%; min-height: 100%; display: -ms-flex; display: -webkit-flex; display: flex; -ms-align-items: center; -webkit-align-items: center; align-items: center; -ms-justify-content: center; -webkit-justify-content: center; justify-content: center; } Se puderem me ajudar, mandei o código e digam o que tenho a fazer. Obrigado!
  8. bruno4away

    Posição de Div

    Puts cara eu não entendi, não tem como você da um exemplo em código?
  9. bruno4away

    Posição de Div

    Bom em gostaria de posicionar as 4 primeiras divs uma do lado da aoutra e as outras quatro em baixo das quatro primeiras div O código que tenho: - CSS .content #box-featured{ width: 780px; margin: 0 auto; background-color: #FFFFFF; background-blend-mode: color; } .content #featured1{ width: 160px; padding-top: 10px; padding-bottom: 10px; padding-left: 17.5px; padding-right: 17.5px; background-color: #FFFFFF; float: left; } .content #featured2{ width: 160px; padding-top: 10px; padding-bottom: 10px; padding-left: 17.5px; padding-right: 17.5px; background-color: #FFFFFF; float: left; } .content #featured3{ width: 160px; padding-top: 10px; padding-bottom: 10px; padding-left: 17.5px; padding-right: 17.5px; background-color: #FFFFFF; float: left; } .content #featured4{ width: 160px; padding-top: 10px; padding-bottom: 10px; padding-left: 17.5px; padding-right: 17.5px; background-color: #FFFFFF; float: left; } .content #featured5{ width: 160px; padding-top: 10px; padding-bottom: 10px; padding-left: 17.5px; padding-right: 17.5px; background-color: #FFFFFF; float: left; } .content #featured6{ width: 160px; padding-top: 10px; padding-bottom: 10px; padding-left: 17.5px; padding-right: 17.5px; background-color: #FFFFFF; float: left; } .content #featured7{ width: 160px; padding-top: 10px; padding-bottom: 10px; padding-left: 17.5px; padding-right: 17.5px; background-color: #FFFFFF; float: left; } .content #featured8{ width: 160px; padding-top: 10px; padding-bottom: 10px; padding-left: 17.5px; padding-right: 17.5px; background-color: #FFFFFF; float: left; } - HTML <div id="box-featured"> <div id="featured1"> <p><a href="#">featured</a></p> </div> <div id="featured2"> <p><a href="#">featured</a></p> </div> <div id="featured3"> <p><a href="#">featured</a></p> </div> <div id="featured4"> <p><a href="#">featured</a></p> </div> <div id="featured5"> <p><a href="#">featured</a></p> </div> <div id="featured6"> <p><a href="#">featured</a></p> </div> <div id="featured7"> <p><a href="#">featured</a></p> </div> <div id="featured8"> <p><a href="#">featured</a></p> </div> </div> Eu gostaria de manter o background da "box-featured" em relação com as outras divs..
  10. bruno4away

    HTML e CSS - Search Box

    Gostaria de saber o que tenho que fazer, para que o botão da lupa fique no campo text de pesquisa no site: eu fiz os códigos: CSS .header form#quick-search{ background: transparent; border: none; padding-top: 16.25px; padding-right: 45px; float: right; } .header input#search{ color: #EAECEE; width: 194px; height: 26px; border-radius: 4px; border: 1px solid #4E699D; font-size: 20px; background-color: white; background-image: url(../images/search-icon.png); background-position: 170px; background-repeat: no-repeat; padding: 10px 10px; } HTML <form id="quick-search" method="post"> <input id="search" type="text" value="Pesquisar..."> </form> Eu gostaria de saber o que preciso para que o botão pesquisar, fique no campo de texto do lado direito, se alguém souber de uma dica..
×

Important Information

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