Arquivado
Este tópico foi arquivado e está fechado para novas respostas.
- 0
Resolvido - Layout Html - dysplay:block; não funciona nos apple devices
Perguntado por
luiz@tkseven.com
-
Conteúdo Similar
-
Por André Gonçalves Fernandes
Prezados,
Boa Noite
A Imagem02 anexa é situação que eu preciso chegar
A imagem01 anexa é o caminho que estou percorrendo. O conteúdo é o mesmo. Acredito que estou no caminho certo, mas não estou conseguindo deixar as três caixas alinhadas na parte de cima e as três caixas alinhadas na parte de baixo.
Abaixo o código que eu apliquei em HTML e CSS referente a imagem 01
Se alguém puder me ajudar agradeço,
HTML
<div class="container">
<p class="title">VEJA MAIS SOBRE AS NOSSAS ESPECIALIDADES E</br>COMO PODEMOS AJUDAR VOCÊ</p>
<div class="box01">
<p class=p01>UTI</p>
<p>Suporte Avançado de</br>Ambulâncias e Suportes</br>Básicos</p>
</div>
<div class="box02">
<p>Área Protegida</p>
<p>Proporcionando total segurança</br>em áreas de risco.</p>
</div>
<div class="box03">
<p>Transferência</p>
<p>Intra-Hospitalar e Inter<br></br>Hospitalar, Casa de repousos, Residenciais.</p>
</div>
<div class="box04">
<p>Posto Fixo</p>
<p>Profissionais especializados para<br></br>atuar em situações de urgências<br></br>e emergência (médicos, enfermeiros e socorridos).</p>
</div>
<div class="box05">
<p>Neonatal</p>
<p>Intra-Hospitalar e Inter Hospitalar, Casa de repousos, Residenciais.
</div>
<div class= "box06">
<p>Eventos</p>
<p>Cobertura de Eventos Religiosos Corridas de Rua</br>Peladas de Futebol, Casas Noturnas, Eventos Culturais</br>Lutas Muay Thai, Boxe, Jiu Jitsu, Vale Tudo</p>
</div>
</div>
CSS
.container{
font-family:Arial, Helvetica, sans-serif;
font-size: 15px ;
color:white;
background-color: rgb(255, 80, 92);
margin: 0px -8px 0px -8px;
padding: 60px 20px 60px 20px;
}
.title{
font-family:Arial, Helvetica, sans-serif ;
font-size: 18px;
text-align: center;
margin: -50px 0px 0px 0px;
padding: 20px 20px 60px 20px;
}
.box01{
display:inline-block;
text-align:center;
}
.p01{
border: solid 1px white;
height: 30px;
width: 100px;
margin: 6px -3px 6px 34px;
padding: 7px 2px 7px 63px;
}
.box02{
display: inline-block;
text-align: center;
}
.box03{
display:inline-block;
text-align:center;
}
.box04{
display:inline-block;
text-align:center;
}
.box05{
display:inline-block;
text-align:center;
}
.box06{
display:inline-block;
text-align:center;
}
-
Por MurilloCSS
Vamos La, Estava fazendo meu site e cheguei no rodape e estou com uma grande duvida uma imensa duvida
Eu quero que este texto do rodape fica no meio e um texto grande mas nao consigo editar o css que raivaaaa
alguem poderia me ajudar?
O CODIGO EM HTML:
<footer class="py-5 bg-dark"> <div class="container"> <p class="m-0 text-center text-white">2015 - 2018 © Todos direitos reservados.<br>Desenvolvido por <b>Arthur Barreto</b> | Hospedado por <b><a target="_blank" href="https://www.reishosting.com.br/minecraft" class="text-white">ReisHost</a></b></p> </div> </footer>
O codigo em css
.py-5 { padding-top: 3rem!important; padding-bottom: 3rem!important; } .bg-dark { background-color: #343a40!important; } article, aside, dialog, figcaption, figure, footer, header, hgroup, main, nav, section { display: block; } *, ::after, ::before { box-sizing: inherit; } user agent stylesheet footer { display: block; } Style Attribute { visibility: visible; } body { margin: 0; font-family: -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif; font-size: 1rem; font-weight: 400; line-height: 1.5; color: #212529; background-color: #fff; } html { box-sizing: border-box; font-family: sans-serif; line-height: 1.15; -webkit-text-size-adjust: 100%; -ms-text-size-adjust: 100%; -ms-overflow-style: scrollbar; -webkit-tap-highlight-color: transparent; } user agent stylesheet html { color: -internal-root-color; } *, ::after, ::before { box-sizing: inherit; } *, ::after, ::before { box-sizing: inherit; }
ALGUEM ME AJUDA PFV
-
Por Mateus Alcântara
Bom dia galera, tenho uma lista de imagem e ao selecionar uma imagem no site ela é aberta dentro de uma div, porém fica um espaço como mostrado na imagem, gostaria de saber como resolver isso, atualmente meu html e meu css estão assim:
<ul>
<div style="width: auto">
</div>
<li><img width="70" src="images/J1.PNg" no repeat; onclick="clickImagem(this.src)" alt="" />Pulseira Teste
<H6> Pulseira Teste.</H6></li>
<li><img width="70" src="images/J3.PNg" onclick="clickImagem(this.src)" alt="" />Pulseira Teste
<H6> Pulseira Teste.</H6></li>
<li><img width="70" src="images/J2.PNg" onclick="clickImagem(this.src)" alt="" />Pulseira Teste
<H6> Pulseira Teste.</H6></li>
<li><img width="70" src="images/J3.PNg" onclick="clickImagem(this.src)" alt="" />Pulseira Teste
<H6> Pulseira Teste.</H6></li>
<li><img width="70" src="images/J2.PNg" onclick="clickImagem(this.src)" alt="" />Pulseira Teste
<H6> Pulseira Teste.</H6></li>
<li><img width="70" src="images/J1.PNg" onclick="clickImagem(this.src)" alt="" />Pulseira Teste
<H6> Pulseira Teste.</H6></li>
<li><img width="70" src="images/J2.PNg" onclick="clickImagem(this.src)" alt="" />Pulseira Teste
<H6> Pulseira Teste.</H6></li>
<li><img width="70" src="images/J3.pNg" onclick="clickImagem(this.src)" alt=""/>Pulseira Teste
<H6> Pulseira Teste.</H6></li>
</ul>
</form>
</div>
<div class="conteudo" id="conteudo" ondrop="drop(event)" ondragover="allowDrop(event)" style="background:#fff">
E CSS:
#conteudo{
width:55%;
height:60%;
float:left;
background-color:#fff;
display: initial;
margin: auto;
z-index: 1;
overflow: hidden;
.columns {
}
-
Por Luiz Carlos Bittar
Bom dia
Comprei o livro Construindo sites com CSS e (X)HTML, e ao tentar acessar www.livrocss.com.br sai a mensagem que não é possível acessar o site, afim de verificar as técnicas na construção.... Gostaria de saber se o site não está mais disponível ou se mudou de endereço.
Obrigado
Luiz Carlos
-
Olá usei os parâmetros, padding e display para separar elementos na minha pagina, o problema é que em devices apple estes parâmetros não funcionam, e no android eles funcionam exatamente como deveriam.
</section>
<div style="display:block; padding: 10px;">
<p><font color="#d7d7d7">Texto que fica entre as section</font></p>
</div>
<section>
Compartilhar este post
Link para o post
Compartilhar em outros sites