Search the Community
Showing results for tags 'width'.
Found 10 results
-
Como expandir Multi-Level Menu para 100% ?? Olá....como vão ?? Eu peguei um CSS Multi-Level Menu como modelo na internet, e gostaria de fazer uma modificação !! O menu (no link abaixo) sem estar no Responsive está ocupando mais ou menos a metade da tela. Eu gostaria que ocupasse 100% !! Tentei fazer tal modificação por conta mas não consegui !! Link = CSS Multi-Level Menu Alguém por favor poderia me dar uma ajuda ?? Desde já obrigado Carlos
-
Como deixar o texto adaptável em uma site com efeito scroll
Bruna Garcia posted a question in Perguntas e respostas rápidas
Meu site é scroll, estou com problemas pra deixar o texto adaptável ao width, o texto não está quebrando automático e está criando uma barra de rolagem no rodapé. O estilo do texto está na classe "Sobre" @charset UTF=8; *{ margin: 0; padding: 0; } body, html{ max-width: 100%; height: 100%; } #menu{ width: 100%; height: 102px; background-color: #000; color: #fff; position: fixed; display: flex; } #menu a{ display: block; color: #fff; text-decoration: none; padding: 48px; flex-grow: 1; font-family: Arial; } #menu a:hover{ padding: 48px; background: #fff; color: #000; } .logo{ display: block; } .content{ width: 100%; height: 100%; background-size: cover; background-repeat: no-repeat; background-position: center center; } p{ text-indent: 50px; text-align: center; } #home{ background-color: #000;} #sobre{ background-color: #fff; width: 100%;} .sobre{ text-align: center; padding: 30px; overflow: visible; } -
Olá pessoal, tudo bem? Estou com uma dúvida aqui, que está me travando a alguns dias, fiz pesquisas e mais pesquisas e ainda não consegui nada conclusivo... Estou programando um layout e vou usar algo simples, uma galeria de noticias em jcycle de uns 600px e que tenha 100% de width. Aí que é o meu problema...Quero saber se existe a possibilidade de eu definir o tamanho da miniatura para 100% do tamanho da tela e não 100% do tamanho da imagem em si, eu sei que é possivel fazer isso com os recursos do background-image e background-size, ja fiz e deu certo, e as imagens se ajustam corretamente nas resoluções. Mas como vou usar php para inserir as imagens, creio que não será viável, então minha busca é de usar uma forma sem ser o parâmetro background do css... Resumindo, quero que a miniatura preencha a tela toda com um height estabelecido, que diminua de acordo com o tamanho da janela do navegador. Não vou postar o código que eu tenho aqui pq acho, que não vai ajudar muito. (Obs. Não estou utilizando Bootstrap). Desde já agradeço a atenção de todos!
-
Boa tarde, Segue meu html, css e print do que está acontecendo. Não era pros articles ficarem com 100px? <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>Projeto</title> <link href="css\style.css" rel="stylesheet" /> </head> <body> <div id="conteudo"> <div id="menu"> menu </div> <div id="infos"> infos </div> <div id="produtos"> <div class="produtos">01</div> <div class="produtos">02</div> <div class="produtos">03</div> <div class="produtos">04</div> </div> </div> </body> </html> #conteudo{ background: #FFF; widht: 850px; height: 1000px; } #menu{ witdh: 850px; height: 40px; background: #333; } #infos{ witdh: 850px; height: 600px; background: #EFEFEF; } #produtos{ witdh: 350px; height: 250px; background: #FFF; display: flex; flex-direction: row; flex-wrap: no-wrap; justify-content: space-around; } .produtos{ witdh: 100px; height: 245px; background: #E9E9E9; margin: 5px; }
-
Pessoal, estou com um problema aqui no meu template, o corpo da postagem no celular fica muito fino. Segue uma imagem mostrando isso, do lado esquerdo é como está no momento, do lado direito é o que eu quero. Alguém sabe como arrumo pra ficar width 100%? Desde já, agradeço. o site é: http://cantodosclassicos.blogspot.com.br/
-
eu preciso aumentar o tamanho de uma div de maneira automática. É assim: estou criando algumas divs dentro de uma laço for, no conteudo da div eu puxo algumas informações do banco de dados. Exemplo: Então veja, que dentro do laço for vai criando várias divs. Até aqui tudo bem, as divs aparecem normalmente uma embaixo da outra. O problema é que cada div, sua largura uma é diferente da outra. A primeira pode ter 10 pixels, a segunda 303 pixels, a terceira pode ter 12 pixels, e assim sucssivamente, o valor é aleatório. Tem como fazer isto??
-
Boa tarde pessoal, fiz uma caixa de texto com o comando <div> criando um container responsivo. Ficou um pouco confuso pois ainda sou amador nesse assunto. Existe alguma maneira de eu diminuir o comprimento dessa caixa de texto e centralizar ??? A imagem embaixo eu consegui mudar simplesmente com o comando ( width="180" height="105" ) , muito simples mas a caixa de texto não consegui. Já procurei em alguns sites, inclui alguns comandos como <style> e mesmo assim não mudou nada. Alguém pode me ajudar? Obrigado André BD <!DOCTYPE HTML PUBLIC> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8"> <meta name="viewport" content="width=device-width, initial-scale=1"> <title> </title> <link rel="stylesheet" type="text/css" href="index.html.css"> </head> <body> <div class="textstyle1"> <div id="container_35965677"> <div id="container_35965677_padding" ><div class="textstyle1"> <span class="textstyle2">Notificação</span> <span class="textstyle3"> <br/><br/></span> <span class="textstyle4"> ...TEXTO... </span> </div> </div> </div> <img src="rc_images/logo_ntind_jpeg.jpg" width="180" height="105" id="img_ade6698" alt="" title="" /> </div> </body> </html>
-
Boa tarde!
-
Boa tarde! Estou com uma problema com o estilo de uma div. Queria fazer uma div com imagens nela, e gostaria que essa div ficasse igual a div com imagens (abaixo do "Quem sou?") do seguinte site: http://editor.wix.com/html/editor/web/renderer/new?siteId=3d9b67f2-8ba2-45f9-832a-bfacfbd306df&metaSiteId=13c470c6-adbf-4635-9bb0-4ec114f2bbd1&editorSessionId=D25DF937-ACA5-4DF2-A6B1-28A42F0DB351 A div que receberia o estilo seria a "<div fotografias" : <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>Beatriz Gomes Fotografia</title> <link rel="stylesheet" type="text/css" href="style.css" /> </head> <body> <div class="all"> <div class="fotoback"> <div class="header"> <div class="menuheader"> <center> <ul> <li class="logo"><img src="moldura.png" width="5%" /></li> <li><a href="#">HOME</a></li> <li><span class="span">|</span><a href="#">BIO</a></li> <li><span class="span">|</span><a href="#">FOTOGRAFIAS</a></li> <li><span class="span">|</span><a href="#">CONTATO</a></li> </ul> </center> </div> <div class="foto"> <img src="imagens/LOGOBEATRIZ.png" width="30%" /> </div> </div> </div> <div class="sobre"> <div class="fotoperfil"> <img src="imagens/perfil.jpg" width=""> </div> <div class="textosobre"> <font face="" size="10"> Quem sou?</font><br><hr width="6%"> <p><font face="" size="4" color="black">sfpjsajfsajfiosajfosaijfiosajfoisajfiosajfosajfsajfiosajfisajfio<br> sdóaskfoafosakfopsakfopsafopakfksafopaksf<br>aspfjsajfosajfosajfiosajfosajfiosajfiosajfiosajfosa<br> pfjsaopjfdsajfsajfiopsajfiosa<br>l´sakfopsajfopksafopksaopfksa<br>o´sfjopsajkpfoksafsaopfkspf<br> sfpjsajfsajfiosajfosaijfiosajfoisajfiosajfosajfsajfiosajfisajfio<br> sdóaskfoafosakfopsakfopsafopakfksafopaksf<br>aspfjsajfosajfosajfiosajfosajfiosajfiosajfiosajfosa<br> pfjsaopjfdsajfsajfiopsajfiosa<br>l´sakfopsajfopksafopksaopfksa<br>o´sfjopsajkpfoksafsaopfkspf<br> sfpjsajfsajfiosajfosaijfiosajfoisajfiosajfosajfsajfiosajfisajfio<br> sdóaskfoafosakfopsakfopsafopakfksafopaksf<br>aspfjsajfosajfosajfiosajfosajfiosajfiosajfiosajfosa<br> pfjsaopjfdsajfsajfiopsajfiosa<br>l´sakfopsajfopksafopksaopfksa<br>o´sfjopsajkpfoksafsaopfkspf<br></p></font> </div> <br> </div> <div class="fotografias"> <ul class="lista"> <li><img src="imagens/fotografias/img1.jpg"></li> <li><img src="imagens/fotografias/img2.jpg"></li> <li><img src="imagens/fotografias/img3.jpg"></li> <li><img src="imagens/fotografias/img4.jpg"></li> <li><img src="imagens/fotografias/img5.jpg"></li> <li><img src="imagens/fotografias/img6.jpg"></li> <li><img src="imagens/fotografias/img7.jpg"></li> <li><img src="imagens/fotografias/img8.jpg"></li> <li><img src="imagens/fotografias/img9.jpg"></li> <li><img src="imagens/fotografias/img10.jpg"></li> <li><img src="imagens/fotografias/img11.jpg"></li> <li><img src="imagens/fotografias/img12.jpg"></li> <li><img src="imagens/fotografias/img13.jpg"></li> <li><img src="imagens/fotografias/img14.jpg"></li> <li><img src="imagens/fotografias/img15.jpg"></li> <li><img src="imagens/fotografias/img16.jpg"></li> <li><img src="imagens/fotografias/img17.jpg"></li> <li><img src="imagens/fotografias/img18.jpg"></li> <li><img src="imagens/fotografias/img19.jpg"></li> <li><img src="imagens/fotografias/img20.jpg"></li> </ul> </div> </div> </body> </html> E aqui está meu css: @charset "utf-8"; /* CSS Document */ .all { margin:0 auto; padding:0px; } .header{ position:absolute; top:0; left:0; right:0; background-color: rgba(0,0,0,.5); height:150px } .logo { padding-right:100px; margin-top:50px; } .menu{ float:right; } .menu ul{ border-color:white; } .menu, ul li { list-style:none; display:inline; padding-right:10px; } .menu, ul, li a{ text-decoration:none; color:white; padding-left:0px; padding-top:10px; } .span { padding:50px; font:bold 12px Verdana, Arial, Helvetica; color:#fff; } .fotoback { background-image:url(imagens/01.jpg); width:100%; height:1080px; background-repeat:no-repeat; position:absolute; top:0; left:0; right:0; text-align:center; } .foto { position:relative; top:200px; } .sobre{ position:static; padding-top:1072px; margin:0 auto; } .fotoperfil { margin:0 auto; float:left; } .textosobre { text-align:center; padding-top:50px; } .fotografias { position:static; width:100%; margin:0 auto; overflow:hidden; } .fotografias img { width:300px; float:left; margin:0px; }
-
Boa tarde iMasters, eu gostaria de saber como faço pra definir a altura de uma DIV pra ser exatamente a altura da tela do visitante. Minha ideia é utilizar essa div como logo/capa do site e o restante do site ficaria abaixo. Seria algo do tipo... assim que o usuário abre lá está a logo/capa, daí teria um botão "Ir para o Site" que ao clicar fazia a página rolar até o fim da capa/começo do conteúdo do site. É isso, espero que dê pra entender. Obrigado.
