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

Kurs 3 HTML Porblem z float left

VPS Starter Arubacloud
0 głosów
294 wizyt
pytanie zadane 28 października 2017 w HTML i CSS przez PrzyszłyProgramista Nowicjusz (240 p.)
edycja 28 października 2017 przez PrzyszłyProgramista

Witam :) Ktoś wie dlaczego mój 5 div(tile5) sie nie chce ustawić po prawej stronie strony tylko przeskakuje na dół, użyłem float left dla square i potem clearboth.Jestem w trakcie przerabiania 3 kursu Html Zelenta i robie to troche inaczej niż od ale myśle żę powinno działać, to jest link do google drive z folderem: https://drive.google.com/open?id=0B-cAAn5MuY-CMm1DWXRPM3l4cjA  Dziekuje z góry za wszelką pomoc.


<html>
<head>
<title>Portfolio</title>

<link rel="stylesheet" href="style.css" type="text/css" />
<link rel="stylesheet" href="css/fontello.css" type="text/css" />
<link href="https://fonts.googleapis.com/css?family=Lobster" rel="stylesheet">

</head>

<body>

<div id="container">

<div class="rectangle">
<div id="logo">Jan Kowalski</div>
<div id="zegar"></div>
</div>

<div style="clear:both;"></div>

<div class="square">
<div class="tile1">Kim jestem</div>
<div class="tile1"> co oferuje</div>
<div style="clear:both;"></div>
<div class="tile2">curriculum vitae</div>
<div class="tile3">Kontakt ze mna</div>
<div style="clear:both;"></div>
<div class="tile4">Live life to the fullest, and focus on the positive.</div>
<div>

<div class="square">
<div class="tile5">5<div>
<div class="yt"><a href="http://youtube.com" target="_blank" class="sociallink">YT</a></div>
<div class="fb"><a href="http://facebook.com" target="_blank" class="sociallink">FB</a></div>
<div class="gplus"><a href="http://plus.google.com" target="_blank" class="sociallink">GPLUS</a></div>
<div class="tw"><a href="http://twitter.com" target="_blank" class="sociallink">TW</a></div>
</div>
<div style="clear:both;"></div>

</body>

</body>
</html>
body
{
    
    background-color: #1f1f14;
    font-size:20px;
    color:white;
    font-family: 'Lobster', cursive;
    
}

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

.rectangle
{
    width: 960px;
    margin: 20px;
    text-align: center;
    
    
}

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

#logo
{
    
    color: white;
    font-size: 70px;
    text-decoration: italic;
    text-align: left;
    width:450px;
    float:left;
    
    }

#zegar
{

  float:left;
 
  
  }

.tile1
{
    height:142px;
    width:230px;
    margin:10px;
    background-color: #3095d3;
    float: left;
    text-align: center;
    
}

.tile2
{
    height:142px;
    width:230px;
    margin:10px;
    background-color: #ff6600;
    float:left;
    text-align: center;
}

.tile3
{
    height:142px;
    width:230px;
    margin:10px;
    background-color: #00cc00;
    float:left;
    text-align: center;
}

.tile4
{
    height:112px;
    width:480px;
    margin:10px;
    background-color: #00cc00;
    float:left;
    text-align: center;
    font-size: 26px;
    padding-top: 50px;
    line-height: 150%;
}

.tile5
{
    height:244px;
    width:420px;
    margin:10px;
    background-color: #666666;
    text-align: justify;
    padding: 30px;
    
}

.yt
{
    
    width:70px;
    height:70px;
    background-color: #f44b42;
    float:left;
    margin:10px;
    
    
}

.fb
{
    
    width:70px;
    height:70px;
    background-color: #f44b42;
    float:left;
    margin:10px;
    
    
}

.gplus
{
    
    width:70px;
    height:70px;
    background-color: #f44b42;
    float:left;
    margin:10px;
    
    
}

.tw
{
    
    width:70px;
    height:70px;
    background-color: #f44b42;
    float:left;
    margin:10px;
    
    
}


 

komentarz 28 października 2017 przez ScriptyChris Mędrzec (190,190 p.)

Wrzuć proszę kod w odpowiednie bloczki - łatwiej będzie sprawdzić kod i znaleźć problem.

komentarz 28 października 2017 przez PrzyszłyProgramista Nowicjusz (240 p.)
OK tak zrobiłem
komentarz 28 października 2017 przez ScriptyChris Mędrzec (190,190 p.)
Jeszcze CSS wstaw w bloczek :)
1
komentarz 28 października 2017 przez Eryk Andrzejewski Mędrzec (164,260 p.)

Przy wstawianiu kodu w bloczek proszę też uważać na to, żeby inny tekst nie wpadł do bloczku (jak w twoim przypadku) - wtedy pytanie jest strasznie nieczytelne. sad

1 odpowiedź

0 głosów
odpowiedź 28 października 2017 przez PrzyszłyProgramista Nowicjusz (240 p.)
Ok udało mi sie ;)

Podobne pytania

0 głosów
1 odpowiedź 217 wizyt
0 głosów
2 odpowiedzi 821 wizyt
pytanie zadane 27 kwietnia 2017 w HTML i CSS przez Eliro Stary wyjadacz (12,160 p.)
0 głosów
1 odpowiedź 639 wizyt

93,023 zapytań

141,986 odpowiedzi

321,288 komentarzy

62,369 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!

...