Wstawianie dwóch zdjęć z napisem obok siebie

[kacper9992]

Witam, jako iż chodzę do Technikum Informatycznego poznałem już nieco o html/css. Na wakacje postanowiłem sobie coś porobić dla własnej ciekawości jakieś stronki. Mam problem, a mianowicie:

Zrobiłem już sobie dużego Diva w którym chciałbym umieścić Wydarzenia ze zdjęciem, i opisem (załącznik ze zdjęciem to pokazuje). Teraz pytanko do was:

- jak podzielić tego diva? może go trochę powiększyć? aby zmieścił się drugi obrazek wraz z opisem tak jak po lewej stronie ? 

- i jeszcze jedno aby tekst po prawej był w kolejnym divie np. białym

[Splatt28]

Jak już się uczysz to ucz się porządnie i ogarnij bootstrapa, wtedy takie działania to luzik

[maqriusz182]

<div style="width:600px">
<div style="float:left;width:45%"><img style="float:left;padding-right:4px" src="https://thumbnails112.imagebam.com/35556/884ffa355557670.jpg"><p>tekst</p></div>
<div style="float:left;width:45%"><img style="float:right;padding-left:4px" src="https://thumbnails112.imagebam.com/35556/884ffa355557670.jpg"><p>tekst</p></div>
</div>

 

[kacper9992]

no wyszło Tylko że wpakowało mi to do diva Ogłoszenia a włożyłem to w Wydarzenia

moze to coś pomoże (drugi zrzut)

[maqriusz182]

dopasuj sobie szerokość diva 600px to był przykład musisz dopasować szerokość do własnych potrzeb

 

[kacper9992]

już prawie jest dobrze coś porobiłem,ale patrzecie.

umieszcza mi w innym divie . 

[Sagitario]

Zobacz tak
 

<style>
.box{width:45%;display:inline-block}
.photo{width:50%;float:left}
.text{padding:10px;}
.blue{color:blue}
.clear{clear:both;}
</style>

<div class="box">
	<div class="photo"><img src="https://www.w3schools.com/html/pic_mountain.jpg" alt="Mountain View"></div>
	<div class="text">Lorem ipsum dolor sit amet</div>
</div>
<div class="box">
	<div class="photo"><img src="https://www.w3schools.com/html/pic_mountain.jpg" alt="Mountain View"></div>
	<div class="text blue">Lorem ipsum dolor sit amet</div>
</div>
<hr>
<div class="box clear">
WYDARZENIA
</div>

 

[dudekm]

Dnia 22.08.2017 o 13:16, Splatt28 napisał:

Jak już się uczysz to ucz się porządnie i ogarnij bootstrapa, wtedy takie działania to luzik

Porządnie tzn. skorzystaj z frameworka, który większość roboty zrobi za Ciebie a Ty nie masz pojęcia jak to zostało wykonane? Bo to sugerujesz.

Jak dla mnie to powinien osiągnąć efekt samodzielnie, dopiero później skorzystać z frameworka i powiedziec "wow, wcześniej musiałem pisać kupę kodu, a teraz mogę to zrobić X klasami".

[Splatt28]

33 minuty temu, dudekm napisał:

Porządnie tzn. skorzystaj z frameworka, który większość roboty zrobi za Ciebie a Ty nie masz pojęcia jak to zostało wykonane? Bo to sugerujesz.

Jak dla mnie to powinien osiągnąć efekt samodzielnie, dopiero później skorzystać z frameworka i powiedziec "wow, wcześniej musiałem pisać kupę kodu, a teraz mogę to zrobić X klasami".

Bo lepiej jest się uczyć nieefektywności? Po to są frameworki, żeby z nich korzystać - normalne, że dobrze wiedzieć co one tak naprawdę robią z kodem itd. Ale wszystko można przeczytać i wcale nie trzeba się męczyć z ustawianiem szerokości na procenty i floatami...

[dudekm]

4 godziny temu, Splatt28 napisał:

Bo lepiej jest się uczyć nieefektywności?

Nie. Jestem zdania, że warto korzystać z frameworków i tu się zgadzamy ale... warto też wiedzieć jak to działa i skąd sie bierze dlatego nie zaczynasz od frameworka.

BTW

Jeśli tak do tego podchodzisz to jestem ciekaw jak napiszesz coś customowego czego nie daje framework

[ZośkaZofia]

Najlepiej wziąć zdjęcia w divy (obrazkom w divach nadać width:100% i max width, żeby przy zmniejszaniu się skalowały) i dać im float:left, bo divy domyślnie są układane blokowo. Pamiętaj, żeby dopasować układ zdjęć do urządzeń mobilnych.