[HTML][CSS] Rozjeżdżanie layoutu po przybliżeniu |
[HTML][CSS] Rozjeżdżanie layoutu po przybliżeniu |
27.02.2018, 23:26:16
Post
#1
|
|
Grupa: Zarejestrowani Postów: 1 Pomógł: 0 Dołączył: 27.02.2018 Ostrzeżenie: (0%) |
Witam,
Dopiero zaczynam swoją przygodę z pisaniem stron. Stworzyłem sobie prosty layout i niestety podczas przybliżania lub oddalania wszystko się rozjeżdża. Jest w stanie ktoś powiedzieć mi co jest źle? Tutaj kod: CODE <!doctype html>
<html lang="pl-PL"> <head> <meta charset="utf-8"> <title>Dokument bez tytułu</title> <meta name='viewport' content='width=device-width, initial-stale = 1'> <style> .cialko{ background-color: skyblue; } .kontener { Left: 50px; width: 1000px; background-color: #723132; } .czcionka-lewa{ padding-top: 4px; padding-bottom: 3px; font-size: 20px; } .col-1 { float: left; width: 200px; background-color: #086813; text-align: center; } .col-2 { float: left; width: 350px; background-color: #A25758; text-align: center; font-size: 22px; } .col-3 { float: left; width: 100px; background-color: #1B4198; text-align: center; font-size: 11px; } .col-4 { float: left; width: 340px; background-color: #AD0087; text-align: center; font-size: 22px; } .przyciskiww{ width: 100px; background-color: #550001; text-align: center; vertical-align: middle; border-radius: 10px; text-transform: uppercase; margin-top: 4px; margin-bottom: 4px; letter-spacing: 1px; border: 2px solid #494949; color: #A00305; transition: all 0.3s linear; } .dotred { height: 20px; width: 20px; margin-top: 2px; margin-bottom: 2px; background-color: red; border-radius: 50%; display: inline-block; border: 2px solid; } </style> </head> <body class='cialko'> <div class="kontener"> <div class="col-1"><div class="czcionka-lewa">Pierwszy</div> </div> <div class="col-2"> <a href='/AAB'><button class='przyciskiww'>Przed</button></a> </div> <div class="col-3"> <span class="dotred"></span> </div> <div class="col-4"> <a href='/AAC'><button class='przyciskiww'>Po</button></a> </div> <div class="col-1"><div class="czcionka-lewa">Drugi</div> </div> <div class="col-2"> <a href='/AAD'><button class='przyciskiww'>Przed</button></a> </div> <div class="col-3"> <span class="dotred"></span> </div> <div class="col-4"> <a href='/AAE'><button class='przyciskiww'>Po</button></a> </div> <div class="col-1"><div class="czcionka-lewa">Trzeci</div> </div> <div class="col-2"> <a href='/AAF'><button class='przyciskiww'>Przed</button></a> </div> <div class="col-3"> <span class="dotred"></span> </div> <div class="col-4"> <a href='/AAG'><button class='przyciskiww'>Po</button></a> </div> </div> </body> </html> |
|
|
28.02.2018, 06:39:32
Post
#2
|
|
Grupa: Zarejestrowani Postów: 6 365 Pomógł: 1114 Dołączył: 30.08.2006 Ostrzeżenie: (0%) |
initial-scale=1 jak już
-------------------- |
|
|
Wersja Lo-Fi | Aktualny czas: 28.04.2024 - 06:41 |