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

BootStrap: Dlaczego zdjęcia są pod sobą, a nie obok siebie

VPS Starter Arubacloud
0 głosów
598 wizyt
pytanie zadane 3 czerwca 2020 w Inne języki przez WiktroH Mądrala (6,550 p.)

Cześć!

Strona działa responsywnie, ale nie mam pojęcia, dlaczego obrazki wyświetlają się pod sobą, a nie obok siebie (nie chodzi o float: left;, bo mam pliki Pana Mirka i tam go nie ma; w ogóle nie dostrzegam różnicy w kodzie).

<body>

	<main>

		<section id="figury">

			<div id="container">

				<header>
					<div id="naglowek">Figury przestrzenne w przedmiotach użytkowych</div>
				</header>
				
				<div id="row">
				
					<div class="col-xs-12 col-sm-6 col-md-4 col-lg-3">
					
						<figure>
							<img src="img/ksiazka.jpg" alt="Książka" class="img-fluid"/>
							<figcaption>Książka - w matematyce prostopadłościan i graniastosłup</figcaption>
						</figure>
					
					</div>
					
					<div class="col-xs-12 col-sm-6 col-md-4 col-lg-3">
					
						<figure>
							<img src="img/apteczka.jpg" alt="Apteczka" class="img-fluid"/>
							<figcaption>Apteczka - w matematyce prostopadłościan i graniastosłup</figcaption>
						</figure>
					
					</div>
					
					<div class="col-xs-12 col-sm-6 col-md-4 col-lg-3">
					
						<figure>
							<img src="img/pilka.jpg" alt="Piłka do gry w piłkę nożną" class="img-fluid"/>
							<figcaption>Piłka - w matematyce kula</figcaption>
						</figure>
					
					</div>
					
					<div class="col-xs-12 col-sm-6 col-md-4 col-lg-3">
					
						<figure>
							<img src="img/roler.jpg" alt="Roler do ćwiczeń" class="img-fluid"/>
							<figcaption>Roler - w matematyce walec</figcaption>
						</figure>
					
					</div>
					
					<div class="col-xs-12 col-sm-6 col-md-4 col-lg-3">
					
						<figure>
							<img src="img/pacholek.jpg" alt="Pachołek" class="img-fluid"/>
							<figcaption>Pachołek - w matematyce stożek</figcaption>
						</figure>
					
					</div>
					
					<div class="col-xs-12 col-sm-6 col-md-4 col-lg-3">
					
						<figure>
							<img src="img/globus.jpg" alt="Globus" class="img-fluid"/>
							<figcaption>Globus - w matematyce kula</figcaption>
						</figure>
					
					</div>
					
					<div class="col-xs-12 col-sm-6 col-md-4 col-lg-3">
					
						<figure>
							<img src="img/pieczatka.jpg" alt="Pieczątka" class="img-fluid"/>
							<figcaption>Pieczątka - w matematyce prostopadłościan i graniastosłup</figcaption>
						</figure>
					
					</div>
					
					<div class="col-xs-12 col-sm-6 col-md-4 col-lg-3">
					
						<figure>
							<img src="img/pilkazk.jpg" alt="Piłka z kolcami" class="img-fluid"/>
							<figcaption>Piłka - w matematyce (bez kolców) kula</figcaption>
						</figure>
					
					</div>
					
					<div class="col-xs-12 col-sm-6 col-md-4 col-lg-3">
					
						<figure>
							<img src="img/papier.jpg" alt="Rolka papieru" class="img-fluid"/>
							<figcaption>Rolka papieru - w matematyce walec</figcaption>
						</figure>
					
					</div>
					
					<div class="col-xs-12 col-sm-6 col-md-4 col-lg-3">
					
						<figure>
							<img src="img/puszka1.jpg" alt="Puszka wielorazowa" class="img-fluid"/>
							<figcaption>Puszka - w matematyce walec</figcaption>
						</figure>
					
					</div>
					
					<div class="col-xs-12 col-sm-6 col-md-4 col-lg-3">
					
						<figure>
							<img src="img/ciasto.jpg" alt="Ciasto" class="img-fluid"/>
							<figcaption>Ciasto - w matematyce prostopadłościan i graniastosłup</figcaption>
						</figure>
					
					</div>
					
					<div class="col-xs-12 col-sm-6 col-md-4 col-lg-3">
					
						<figure>
							<img src="img/opakczkl.jpg" alt="Pudełko po czekoladzie za oddanie krwi" class="img-fluid"/>
							<figcaption>Pudełko - w matematyce prostopadłościan i graniastosłup</figcaption>
						</figure>
					
					</div>
					
					<div class="col-xs-12 col-sm-6 col-md-4 col-lg-3">
					
						<figure>
							<img src="img/opak.jpg" alt="Okrągłe opakowanie" class="img-fluid"/>
							<figcaption>Okrągłe opakowanie - w matematyce walec</figcaption>
						</figure>
					
					</div>
					
					<div class="col-xs-12 col-sm-6 col-md-4 col-lg-3">
					
						<figure>
							<img src="img/pilkadt.jpg" alt="Piłka tenisowa" class="img-fluid"/>
							<figcaption>Piłka do tenisa - w matematyce kula</figcaption>
						</figure>
					
					</div>
					
					<div class="col-xs-12 col-sm-6 col-md-4 col-lg-3">
					
						<figure>
							<img src="img/trutka.jpg" alt="Opakowanie po trutce na szczury" class="img-fluid"/>
							<figcaption>Opakowanie po trutce na szczury - w matematyce walec</figcaption>
						</figure>
					
					</div>
					
					<div class="col-xs-12 col-sm-6 col-md-4 col-lg-3">
					
						<figure>
							<img src="img/puszka2.jpg" alt="Puszka" class="img-fluid"/>
							<figcaption>Puszka - w matematyce walec</figcaption>
						</figure>
					
					</div>
					
					<div class="col-xs-12 col-sm-6 col-md-4 col-lg-3">
					
						<figure>
							<img src="img/kostka.jpg" alt="Kostka do gry" class="img-fluid"/>
							<figcaption>Kostka do gry - w matematyce sześcian, prostopadłościan i graniastosłup</figcaption>
						</figure>
					
					</div>
				
				</div>		
				
			</div>

		</section>
	
	</main>
	
	<script src="https://code.jquery.com/jquery-3.3.1.slim.min.js" integrity="sha384-q8i/X+965DzO0rT7abK41JStQIAqVgRVzpbzo5smXKp4YfRvH+8abtTE1Pi6jizo" crossorigin="anonymous"></script>
	
	<script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.14.3/umd/popper.min.js" integrity="sha384-ZMP7rVo3mIykV+2+9J3UJ46jBk0WLaUAdn689aCwoqbBJiSnjAK/l8WvCWPIPm49" crossorigin="anonymous"></script>
	
	<script src="js/bootstrap.min.js"></script>

</body>
</html>

Dzięki z góry!

1 odpowiedź

+2 głosów
odpowiedź 3 czerwca 2020 przez eunstachy Stary wyjadacz (14,180 p.)
wybrane 3 czerwca 2020 przez WiktroH
 
Najlepsza
<div id="row">

zmień na

<div class="row">

 

komentarz 3 czerwca 2020 przez WiktroH Mądrala (6,550 p.)

Jak Ci dziękować Dobry Człowieku? smileysmileysmiley

Podobne pytania

0 głosów
1 odpowiedź 526 wizyt
pytanie zadane 17 maja 2017 w HTML i CSS przez Bartlomiej Bywalec (2,480 p.)
0 głosów
1 odpowiedź 1,022 wizyt
pytanie zadane 17 listopada 2018 w HTML i CSS przez Q_Nick Mądrala (5,010 p.)

92,834 zapytań

141,778 odpowiedzi

320,826 komentarzy

62,164 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

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!

...