08.04.2018, 15:57
Witam,
Utworzyłem taki HTML:
Oraz CSS:
Na komputerze wszystko ładnie działa, jednak jest problem z urządzeniami mobilnymi. Dla porównania - Tak wygląda wersja na PC:
A na telefonie:
Jak zrobić, żeby wszędzie wyświetlało się tak samo? (Głównie chodzi o przyciski ..)
Utworzyłem taki HTML:
Kod:
<div class="box">
<h1>Welcome!</h1>
<span class="donkey"> Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nam maximus elit non erat scelerisque condimentum. Donec at neque eros. Pellentesque libero ex, fermentum vitae ex sed, rutrum ullamcorper magna. Pellentesque sed tortor dui. Aenean posuere hendrerit libero ac vehicula. Nullam id nisi a elit commodo sagittis non ac elit.</span> <br />
<button type="submit" class="ice ">Let's check!</button>
<button role="button" class="ice">what?</button>
</div>
Oraz CSS:
Kod:
.box {
margin:0px auto;
overflow: hidden;
border:1px solid #DDD;
width:30%;
min-width:300px;
text-align:left;
-webkit-border-radius: 3px;
-moz-border-radius: 3px;
border-radius: 3px;
}
.ice {
float:left;
width:50%;
text-align: center;
border-top:1px solid #DDD;
padding:10px;
}
.ice[type="submit"] {
border-right:1px solid #DDD;
}
.donkey {
line-height:150%;
}
Na komputerze wszystko ładnie działa, jednak jest problem z urządzeniami mobilnymi. Dla porównania - Tak wygląda wersja na PC:
A na telefonie:
Jak zrobić, żeby wszędzie wyświetlało się tak samo? (Głównie chodzi o przyciski ..)