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

Pytanie do ostatniego kursu p.Mirka HTML iCSS

Object Storage Arubacloud
0 głosów
238 wizyt
pytanie zadane 12 maja 2015 w HTML i CSS przez timati Bywalec (2,060 p.)

Witam,

Problem pojawił się u mnie już zaraz na początku kursu. Kiedy tworzymy tile1,tile2,tile3,tile4 u Pana Mirka niebieskie sa obok siebie u mnie tego nie mogę zrobić. Dodaje to 

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

Ale wraz wszystkie tabelki zapisują się pod sobą.

I ogólnie logo, zegarek i te tabelki są bardzo przesunięte w prawo i tez ich nie mogę normalnie ustawić na środku.

Wkleje moje urywki kodu HTML i CSS

</head>

<body>
	<div id="container">
	
		<div class="rectangle">
			<div id="logo">Mateusz</div>
			<div id="zegar">12:00:00</div>
			<div style="clear: both;"></div>
		</div>
	
		<div class="square">
			<div class="tile1">1</div>
			<div class="tile1">1</div>
			<div style="clear:both;"></div>
			
			
			<div class="tile2">2</div>
			<div class="tile3">3</div>
			
			<div style="clear:both;"></div>
			<div class="tile4">4</div>
		</div>
		<div class="square">
		<div class="tile">5</div>
		
		
		</div>
		<div style="clear:both;"></div>
	
		<div class="rectangle"></div>
	</div>
	
</body>
</html>

CSS

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

}

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

}
.rectangle

{
width: 960px;
margin: 20px;
text-algin: center;


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

}

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

#zegar
{
float: left;
font-family: 'Josefin Sans', sans-serif;
font-size: 70px;
margin-top: 10px;
margin-bottom: 10px;

}

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

.tile2
{
margin: 10px;
width: 230px;
height: 142px;
background-color: #666666;
float: left;
}

.tile3
{
margin: 10px;
width: 230px;
height: 142px;
background-color: #93c748;
float: left;
}

.tile4
{
margin: 10px;
width: 480px;
height: 142px;
background-color: #ee5a32;

}

.tile5
{
margin: 10px;
width: 480px;
height: 304px;
background-color: #666666;

}

 

1 odpowiedź

+2 głosów
odpowiedź 12 maja 2015 przez Arkadiusz Waluk Ekspert (287,950 p.)

Na pewno, co pierwsze rzuca mi się w oczy, to powinno być text-align: center;

Dalej, szerokość diva container jest za mała - o ile dobrze pamiętam w kursie było 1000px.

komentarz 12 maja 2015 przez timati Bywalec (2,060 p.)
Ale Panu Mirkowi niebieskie prostokąty ustawiły się tak ładnie jeden obook drugiego zanim to dodał. Z tym tez patrzyłem i nic.
komentarz 12 maja 2015 przez Arkadiusz Waluk Ekspert (287,950 p.)
Dałem edit wyżej, szerokość diva containter jest za mała. Prawdopodobnie to jest jedynym problem, że brakuje Ci jednego 0 :)
komentarz 12 maja 2015 przez timati Bywalec (2,060 p.)
Dzięki mistrzu jedno 0 a tyle szukania, złości i brzydkich słów :))
komentarz 12 maja 2015 przez Arkadiusz Waluk Ekspert (287,950 p.)
Nie ma za co :) Dodatkowo zapamiętaj że jest text-align, a nie text-algin bo później wyśrodkowanie tekstu nie będzie Ci chciało działać.

Podobne pytania

–3 głosów
2 odpowiedzi 320 wizyt
pytanie zadane 20 września 2015 w Nasze projekty przez uMAXa Gaduła (4,290 p.)
0 głosów
2 odpowiedzi 197 wizyt
pytanie zadane 9 grudnia 2017 w HTML i CSS przez Darkis Początkujący (290 p.)
0 głosów
2 odpowiedzi 212 wizyt
pytanie zadane 3 listopada 2017 w C i C++ przez Fergus Obywatel (1,010 p.)

92,588 zapytań

141,439 odpowiedzi

319,688 komentarzy

61,974 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.

Akademia Sekuraka

Kolejna edycja największej imprezy hakerskiej w Polsce, czyli Mega Sekurak Hacking Party odbędzie się już 20 maja 2024r. Z tej okazji mamy dla Was kod: pasjamshp - jeżeli wpiszecie go w koszyku, to wówczas otrzymacie 40% zniżki na bilet w wersji standard!

Więcej informacji na temat imprezy znajdziecie tutaj. Dziękujemy ekipie Sekuraka za taką fajną zniżkę dla wszystkich Pasjonatów!

Akademia Sekuraka

Niedawno wystartował dodruk tej świetnej, rozchwytywanej książki (około 940 stron). Mamy dla Was kod: pasja (wpiszcie go w koszyku), dzięki któremu otrzymujemy 10% zniżki - dziękujemy zaprzyjaźnionej ekipie Sekuraka za taki bonus dla Pasjonatów! Książka to pierwszy tom z serii o ITsec, który łagodnie wprowadzi w świat bezpieczeństwa IT każdą osobę - warto, polecamy!

...