• Najnowsze pytania
  • Bez odpowiedzi
  • Zadaj pytanie
  • Kategorie
  • Tagi
  • Zdobyte punkty
  • Ekipa ninja
  • IRC
  • FAQ
  • Regulamin
  • Książki warte uwagi

Problem z float:left;

VPS Starter Arubacloud
0 głosów
411 wizyt
pytanie zadane 31 lipca 2016 w HTML i CSS przez james30k Bywalec (2,260 p.)
edycja 31 lipca 2016 przez james30k

Witam!

Problem dotyczy float:left; iż na stronie nie układają mi się divy obok siebie tylko pod spodem, kod:

HTML
 

<!DOCTYPE HTML>
<html lang="pl">
<head>
    <title></title>
    <meta name="description" content="Witaj na blogu gdzie dowiesz się wielu ciekawych rzeczy :)">
    <meta name="keyworld" content="blog,ciekawe,życie,jak,zacząłem ,programować,co,teraz,robić">

    <link rel="stylesheet" href="style.css" type"text/css">
    <link href='https://fonts.googleapis.com/css?family=Lato|Josefin+Sans&subset=latin,latin-ext' rel='stylesheet' type='text/css'>
    
    
</head>
<body>
    <div id="container">
    
        <div class="rectangle">
        <div id="logo"></div>
        <div id="zegar">12:00</div>
        <div style="clear:both;"></div>
        
        </div>
        
        <div class="square"></div>
        <div class="square"></div>
        <div style="clear: both;"></div>
    
    
        <div class="rectangle"></div>
    
    </div>
</body>
</html>



CSS

body
{
background-color:#303030;
colo: #ffffff;    
font-family: 'Lato', sans-serif;
font-size:20px;
}

#container
{
    width:1000px;
    margin-left:auto;
    margin-right:auto;
}

.rectangle
{
    width:960px;
    margin:20px;
}

.square
{
    width:50%;
    float:left;
    
}

#logo
{
    float:left;
    font-family: 'Josefin Sans', sans-serif;
    font-size: 70px;
    width:600px;
}

#zegar
{
    float:left;
    font-family: 'Josefin Sans', sans-serif;
    font-size:70px;
    width:600px;
}

 

1
komentarz 31 lipca 2016 przez Arkadiusz Waluk Ekspert (288,770 p.)

Kod wstawiamy w przeznaczony do tego bloczek code.

komentarz 31 lipca 2016 przez james30k Bywalec (2,260 p.)
Okey, dzięki nie wiedziałem tego.

3 odpowiedzi

+1 głos
odpowiedź 31 lipca 2016 przez Barttyyy Gaduła (4,680 p.)
Chcesz żeby godz 12:00 była po lewo od nazwiska?
komentarz 31 lipca 2016 przez james30k Bywalec (2,260 p.)
godzina po prawo nazwisko po lewo
komentarz 31 lipca 2016 przez Barttyyy Gaduła (4,680 p.)
#logo
{
    float:left;
    font-family: 'Josefin Sans', sans-serif;
    font-size: 70px; 	
}

#zegar
{
    float:right;
    font-family: 'Josefin Sans', sans-serif;
    font-size:70px;
	text-align: right;
}

Spróbuj tego

0 głosów
odpowiedź 31 lipca 2016 przez Eimens Maniak (69,240 p.)
Jeżeli #rectangle ma szerokość 960px a #logo i #zegar razem mają 1200px (po 600 na jeden) To chyba logiczne że nie zmieszczą się w jednej linii. żeby zmieścił się koło siebie wypadało by dać dla #logo i #zegar trochę mniejszą szerokość, najlepiej tak aby oba miały razem te 960px.
0 głosów
odpowiedź 12 maja 2017 przez steve_12 Początkujący (320 p.)
Źle liczysz szerokości. Masz diva 450px i chcesz zmieścić dwa razy po 230 px, tak to wygląda w pierwszym przypadku, dalej jest pewni podobnie

Pozdro
komentarz 12 maja 2017 przez Shaoi Mądrala (7,020 p.)

pytanie zadane 31 lipca 2016

Chyba nie muszę mówić nic więcej.

Podobne pytania

0 głosów
3 odpowiedzi 363 wizyt
pytanie zadane 6 kwietnia 2016 w HTML i CSS przez Stami Gaduła (3,790 p.)
0 głosów
1 odpowiedź 628 wizyt
0 głosów
1 odpowiedź 748 wizyt
pytanie zadane 29 marca 2016 w HTML i CSS przez artimal Gaduła (4,800 p.)

92,975 zapytań

141,938 odpowiedzi

321,181 komentarzy

62,302 pasjonatów

Motyw:

Akcja Pajacyk

Pajacyk od wielu lat dożywia dzieci. Pomóż klikając w zielony brzuszek na stronie. Dziękujemy! ♡

Oto polecana książka warta uwagi.
Pełną listę książek znajdziesz tutaj.

Wprowadzenie do ITsec, tom 2

Można już zamawiać tom 2 książki "Wprowadzenie do bezpieczeństwa IT" - będzie to około 650 stron wiedzy o ITsec (17 rozdziałów, 14 autorów, kolorowy druk).

Planowana premiera: 30.09.2024, zaś planowana wysyłka nastąpi w drugim tygodniu października 2024.

Warto preorderować, tym bardziej, iż mamy dla Was kod: pasja (użyjcie go w koszyku), dzięki któremu uzyskamy dodatkowe 15% zniżki! Dziękujemy zaprzyjaźnionej ekipie Sekuraka za kod dla naszej Społeczności!

...