Jump to content

Search the Community

Showing results for tags 'position'.



More search options

  • Search By Tags

    Type tags separated by commas.
  • Search By Author

Content Type


Forums

  • Q&A Desenvolvimento
    • Perguntas e respostas rápidas
  • Web Development
    • HTML e CSS
    • Javascript
    • PHP
    • Ruby
    • Python
    • Java
    • .NET
    • Docker, Kubernets and other environments
    • WordPress
    • Mobile
    • Agile
    • Desenvolvimento de Games
    • Banco de Dados
    • Design and UX
    • Algoritmos & Outras Tecnologias
  • Entretenimento e uso pessoal
    • Segurança & Malwares
    • Geral
    • iMasters's pub

Find results in...

Find results that contain...


Date Created

  • Start

    End


Last Updated

  • Start

    End


Filter by number of...

Joined

  • Start

    End


Group


Google+


Hangouts


Skype


Twitter


deviantART


Github


Flickr


LinkedIn


Pinterest


Facebook


Site Pessoal


Localização


Interesses

Found 14 results

  1. Estou querendo deixar um rodapé fixo no topo a medida que o mesmo alcança o topo da página, porém estou encontrando dificuldades ao utilizar position: sticky, segue o código completo, se eu colocar a configuração de sticky na classe .side-column funciona bem, porém quero apenas no footer, alguém saber como resolver? <!DOCTYPE html> <html> <head> <style> .wideBody .side-column { float: right; order: 2; width: 300px; } .wideBody .side-column footer { position: sticky; position: -webkit-sticky; top: 0; } .wideBody .main-column { align-self: flex-start; float: left; width: 500px; border: 2px solid #4CAF50; } .resultados { border: 2px solid #4CAF50; margin-bottom:25px; position:relative; } footer { border: 2px solid #4CAF50; } </style> </head> <body class="wideBody"> <main> <div> <div class="main-column"> coluna principal<br /> coluna principal<br /> coluna principal<br /> coluna principal<br /> coluna principal<br /> coluna principal<br /> coluna principal<br /> coluna principal<br /> coluna principal<br /> coluna principal<br /> coluna principal<br /> coluna principal<br /> coluna principal<br /> coluna principal<br /> coluna principal<br /> coluna principal<br /> coluna principal<br /> coluna principal<br /> coluna principal<br /> coluna principal<br /> coluna principal<br /> coluna principal<br /> coluna principal<br /> coluna principal<br /> coluna principal<br /> coluna principal<br /> coluna principal<br /> coluna principal<br /> coluna principal<br /> coluna principal<br /> coluna principal<br /> coluna principal<br /> coluna principal<br /> coluna principal<br /> coluna principal<br /> coluna principal<br /> coluna principal<br /> coluna principal<br /> coluna principal<br /> coluna principal<br /> coluna principal<br /> coluna principal<br /> coluna principal<br /> coluna principal<br /> coluna principal<br /> coluna principal<br /> coluna principal<br /> coluna principal<br /> coluna principal<br /> coluna principal<br /> coluna principal<br /> coluna principal<br /> coluna principal<br /> coluna principal<br /> coluna principal<br /> coluna principal<br /> coluna principal<br /> </div> <aside class="side-column"> coluna auxiliar <div class="resultados"> 1 -> 2<br /> 1 -> 2<br /> 1 -> 2<br /> 1 -> 2<br /> 1 -> 2<br /> 1 -> 2<br /> 1 -> 2<br /> 1 -> 2<br /> 1 -> 2<br /> 1 -> 2<br /> 1 -> 2<br /> 1 -> 2<br /> </div> <footer> rodape fixo </footer> </aside> </div> </main> </body> </html>
  2. lezão

    Problemas com posicionamentos

    Boa Tarde, pessoal! Td bem com vcs? Olha eu ai novamente! Pesquisei e fucei e nada, não consegui nada, não de ficar enchendo o saco de vcs, mas qnd a corda aperta, corro aqui para um help. Estou com um código que roda perfeitamente, mas qnd eu preciso de um posicionamento, naun vai. vejam na imagem abaixo para entender? Vejam que o valor e os outros item abaixo dele, dependendo da quantidade de texto ele fica em um ponto. Gostaria que ele ficasse, com muito ou pouco texto na posição da 3ª imagem. Será possivel isso ? meu codigo CSS: .banner img { max-width: 100% !important; height: 200px; } .container-cards { flex-wrap: wrap; display: inline-flex; width: 400px; align-items: center; justify-content: center; } .box-container { /*border: 1px solid red;*/ display: flex; background: #fcfcfc; font:80%/1 Arial; font-size: 14px; border-radius: 5px; align-items: center; width: 100%; height: 80px; border: 0px solid #AAAAAA; margin: 5px; background-color: #fcfcfc; -webkit-box-shadow: 1px 3px 5px rgba(250, 242, 242, 0.77); -moz-box-shadow: 1px 3px 5px rgba(250, 242, 242, 0.77); box-shadow: 1px 3px 5px rgba(250, 242, 242, 0.77); } .box-image { width: 20%; align-items: center; display: flex; height: 100%; justify-content: left; border-right: 0px solid #AAAAAA; } .box-container .box-image img { width: 75px; height: 75px; } .box-container .box-content { align-items: left; display: flex; height: 75%; justify-content: left; flex-direction: column; padding: 10px; } .title { margin-bottom: 10px; font-size: 16px font-weight: bold; color: #000; } .description { font:80%/1 Arial; font-size: 14px; color: #8a8686; top: 50px; left: 50px; } Codigo HTML: <div class="box-container"> <section class=box-image>&nbsp; <img src="<?php echo $Foto_produto; ?>" style="border-radius:10px" width="250px" height="230px"/> </section> <section class="box-content"> <label class="title"> <div align="left"><b><?php echo strtoupper($Nome_produto); ?></b></div></label> <span class="description"><div align="left"><?php echo $Descricao_produto; ?></div></span> </section> <section class=box-image-2> <label class="title"><div align="center"><b><?php echo($Valor_produto) ?></b></div></label> <span class="description"> <div align="left"><br/> <input type="checkbox" name="sabor" id="evento_value2" value="<?php echo $Valor_produto; ?>"> <input type="hidden" name="vl_sabor" value="<?php echo $Valor_produto; ?>"> <SELECT name="qntdade" width="2"> <option value="1">1</option> <option value="2">2</option> </SELECT> </div></span> </section> </div> Desde ja muito obrigado!
  3. Olá, estou com uma dificuldade para posicionar um elemento. Se trata de um pop-up que aparece na tela ao clicar. Acontece que esse pop-up não fica centralizado em todas as telas dependendo da resolução. No momento estou usando o position absolute, a div é essa abaixo: .form-structor { background-color: #222; border-radius: 15px; height: 550px; width: 450px; position: absolute; top: -100px; left: 170px; overflow: hidden; } Também já tentei: {position: relative; top: 50%; left: 50%;} Alguém pode me ajudar? Qual propriedade eu utilizo para ficar centralizado tanto horizontal e quanto vertical em qualquer resolução?
  4. Olá comunidade, No site que estou desenvolvendo eu criei um background com 3 imagens, top, bottom e center, ambas tem 1920 de largura. Meu código: body { width: 100%; background: url(../images/top-fon-bg.jpg) top center no-repeat, url(../images/bottom-fon-bg.jpg) bottom center no-repeat, url(../images/fon-repeat.jpg) center repeat-y; background-color: #000000; font-family: Tahoma, Arial, sans-serif; font-size: 12px; color: #7d7d7d; line-height: 1; min-height: 100vh; } O problema é que a imagem do centro não fica centralizada, parece que ela se move 1 pixel pro lado. Alguém sabe o que pode ser? Obrigado.
  5. ZecaLoteiro

    Gráfico: alinhamento e posicionamento

    Bom dia, preciso fazer o alinhamento de um grid com os eixos de um gráfico e estou tendo dificuldade em obter o posicionamento dos elementos do gráfico. Ex: A chartarea(0) mesmo quando definido como 100 não ocupa 100% da largura do chart. Ou seja é 100% do que? Coloquei umas bordas para facilitar a visualização. Alguém já passou por isso? Poderia dar um help? Saberia informar em relação a qual objeto é a largura do chartarea? grafico.ChartAreas(0).BorderColor = Color.Red grafico.ChartAreas(0).Position.Width = 100 grafico.ChartAreas(0).Position.Height = 100 grafico.ChartAreas(0).BorderDashStyle = ChartDashStyle.Solid grafico.ChartAreas(0).BorderWidth = 2 https://prnt.sc/jqo3bv
  6. arthurcastro

    Alinhamento de DIV sem usar position.

    Oi! Tudo bem? Poderiam me dar uma ajuda, por favor? :) Estou precisando alinhar algumas DIVS da seguinte maneira: Supondo que tenhamos uma div pai de largura 100%: Na primeira linha: 3 DIVS de mesmo tamanho (largura: 33.3333% altura: 120px), seguida por uma DIV coluna para anúncio de mesma largura só que com altura de 240px. Na segunda linha: 3 DIVS de mesmo tamanho (largura: 33.3333% altura: 120px), com a continuação da DIV coluna para anúncio da linha de cima. Como faço para que as 3 divs da segunda linha encostem próximo as 3 DIVS da primeira linha visto que a DIV de anúncio empurra as DIVS da segunda linha pra baixo e sem usar position: absolute ou fixed. Tem algum float ou display que faça as DIVS se ajustarem automaticamente sem precisar forçar nada com position, margin e essas outras opções? #div { display: inline-block; width:120px; height:120px; border: 1px solid #000000; } Como fazer as 3 DIVS de baixo encaixarem ali no espaço que ficou em branco? <div id="wrapper"> <div id="div">DIV<br/><br/><br/><br/><br/><br/></div> <div id="div">DIV<br/><br/><br/><br/><br/><br/></div> <div id="div">DIV<br/><br/><br/><br/><br/><br/></div> <div id="div" style="height: 240px;">DIV ADS<br/><br/><br/><br/><br/><br/></div> <div id="div">DIV<br/><br/><br/><br/><br/><br/></div> <div id="div">DIV<br/><br/><br/><br/><br/><br/></div> <div id="div">DIV<br/><br/><br/><br/><br/><br/></div> </div>
  7. Olá a todos! Estou fazendo um formulário para que ele fique na parte inferior da viewport! Em todos os navegadores funciona(opera,mozilla,IE) porém no google chrome o formulário não obedece o css! O interessante é que abrindo locamente funciona,porém no servidor da godaddy não! Já tentei usar o -webkit-transform:translateZ(0); para o elemento só que não funcionou! Se alguém puder me ajudar agradeço! Segue o código : HTML <form method="POST" action="processa.php"> <span>Telefone</span> <input type="text" name="telefone" placeholder="Digite seu número" required> <br> <input type="submit" value="Enviar" class="btn"> </form> CSS form {-webkit-transform:translateZ(0); width:40%; height:auto; background:#b10f15; position:fixed; bottom:0; left:32%; box-shadow:2px 2px 5px #000; padding:15px;} input {display:block; width:520px; padding:5px;} span {color:#fff; font-size:1.4em;} #regioes {display:block; width:534px; padding:5px;} .btn {width:100px; border:0; background:#333; color:#fff; cursor:pointer; font-size:1.1em; margin:auto;}
  8. Olá, Estou tentado fazer um efeito no qual ao rolar a página, uma div sobe e outra desce gradativamente por baixo da que está subindo. Porém, não consigo imaginar como fazer isso. É o mesmo efeito que esse site usa http://www.globalgeo.com.br Alguma sugestão? Att, Diogo.
  9. Latorre

    Imagem em cima de um texto

    Bom dia, estou com um problema com posicionamento de imagem no meu css. Tenho uma escrita e uma imagem, preciso posicionar a imagem em cima do escrito segue o html e o css HTML <div class='footer'> <div class='img-footer'> <img src='../src/assinaturas/{$imagem}.png . '/> </div> <h4 class='text-center'><b><u> {$laudo['NM_MEDICO_CRM']} </u><b></h4> </div> css .footer { position:absolute; bottom: 20; width:90%; } .img-footer{ width: 40%; text-align: center; font-size: 30px; margin: auto; position: absolute; top: 0; bottom: 0; left: 0; right: 0; } Não consigo por nada deixar a imagem por cima da assinatura, alguém consegue me ajudar?
  10. Bergs

    position fixed no Chrome

    Pessoal estou com um problema com um menu com position fixed no chrome, quando uso a barra de rolagem o position fixed não fixa o top em 0px, ele anda um pouco escondendo a navegação, já percebi que se eu der um overflow-y com hidden na tag <html> ele vai funcionar normalmente, mas não posso fazer isso porque fico sem a barra de rolagem do navegador. O que posso fazer para solucionar esse problema?
  11. lucashp745

    Site c/ problemas no IE(CSS)

    Estou fazendo um trabalho para meu curso de CSS , estava configurando ele no GoogleChrome mas quando fui testa no IE estava totalmente diferente , usei (position:absolut c/px) configurei o site todo em PIXEL. A composição que usei se adéquo perfeitamente no GC so preciso de uma maneira de adequar ao IE sem ter que refazer todo trabalho. index.css index.html
  12. AlessandroPiaz

    Float em position relative

    Fala pessoal. Em determinada pagina do meu site, criei uma sequencia de elementos, sendo um em baixo do outro, um alinhado a esquerda e outro a direita e assim procede. Mas sempre que coloco o float:right pros elementos da direita, parece que o position se comporta como absolute, mesmo sendo relative. E a organização dos elementos só fica certa com o position relative funcionando para todos. Preciso dos elementos da direita alinhados a direita e com o position relative funcionando direito. Me ajudem por favor.
  13. Olá a todos, tenho a seguinte estrutura html: <header> <div id="head"> <img id="logo" alt="Logomarca" src="../images/Logo.PNG"/> <img id="separadorReto" alt="Separador Reto" src="imagens/separadorReto.jpg"/> <h1 id="titulo">Título Principal</h1> <h2 id="subTitulo">Sub Título</h2> <span>Um slogan qualquer</span> </div> <div id="subHead"> <h1 id="tituloPers">Título da Categoria Selecionada</h1> </div> </header> configurado pelas seguintes regras css: #head{ height:180px; background:#444; } #logo{ width:150px; margin:15px 0 10px 12%; position:relative; float:left; } #separadorReto{ height:150px; width:2px; margin:20px; float:left; } #titulo{ position:relative; color:#fff; margin:0px; padding:20px 0 0 20px; } #subTitulo, span{ position:relative; color:#ccc; margin:20px 0 0 0; } #subHead{ height:60px; background:#202020; } #subHead h1{ color:#FFD605; text-align:center; margin-top:0px; padding-top:10px; float:none; } Acontece que o Título do h1 dentro da div subHead não fica centralizado na tela, como, com a div head a 180px, parece que o posicionamento de algum item acima está influenciando no h1 da div subHead que diga-se de passagem é o único Elemento dentro da div subHead. Curioso é que quando a div Head está com width=200px, o h1 do subHead está centralizado corretamente mas reduzindo 20px ocorre essa quebra de alinhamento. Alguma luz dos ilustres pares?
  14. codercss

    Como devo utilizar o float

    Olá, Estou com dificuldades em utilizar a propriedade float. E penso que não estou a fazer o uso correcto do positon. Neste exemplo: https://jsfiddle.net/n9s031z2/ Pretendo que o conteúdo do nav e article dentro do section estejam lado a lado! Mas a partir do momento que aplico o a propriedade float - left e right, ele saem fora da tag section(borda verde) e main(borda vermelha). O que tem lógica, pois ficam a flutuar, um do lado esquerdo e outro do lado direito. Mas como consigo que eles fiquem no lado esquerdo e direito mas dentro da tag section e main. Para auxiliar a explicação vejam as linhas verdes, que são as bordas do section e a linha vermelha que é a borda do main. Penso que isto em haver com as propriedades position. Os valores de relative e absolute ainda não percebi bem! :/ Caso tenham algum artigo agradeço a partilha. Obrigado e bons códigos
×

Important Information

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