Tło obejmujące obiekty rozstawione za pomocą float

Question

Witam, napisałem stronę a jej obiekty rozmieściłem za pomocą margin i float:(left,both,right). Z tym że po dodaniu floatów tło które wcześniej okalało większość elementów pojawia się nad nimi w postaci paska, tak jakby nie brało pod uwagę floatów.

Ustawiłem wysokość na 80vw, ale wtedy nie poprawnie się skaluje - gdy rozłożę okno przeglądarki na pół monitora tło kończy się przed elementami. Jak to poprawnie ustawić?

main{
	background-color:rgba(0, 0, 0, 0.90);
	width:60vw;
	height:80vw;
}

Comments

Ale naprawdę masz takie cuda jak flex czy gird które prawdopodobnie rozwiążą twój problem w przeciwieństwie do float i zabawy z nim.

Answer 1

Prawdopodobnie nie użyłeś lub źle zastosowałeś clear: both Ale tak jak wskazał @kenjiro244 lepiej używać w dzisiejszych czasach flexbox

Comments

ok, tylko tak przeglądam i testuje tego fexboxa to on głównie rozstawia wszystko w postaci kolumn poziomo i pionowo w tym elementy wewnątrz elementu na którym go użyłem - całkowicie psuje  szyk:

po:

Da się to jakoś pominąć i rozstawić te większe elementy? prawo, lewo... Obczaję jeszcze Grida