wyśrodkowanie divów HTML5

pytanie zadane 28 marca 2016 w HTML i CSS przez niezalogowany

Witam, mam problem z wyśrodkowaniem main w HTML5, oraz pozbycia się górnej przestrzeni. Przeszukałem internet ale wiem, że błąd występuje gdzieś indziej.

http://wklej.org/id/2179750/

http://wklej.org/id/2179751/

4 odpowiedzi

odpowiedź 28 marca 2016 przez arces Pasjonat (17,700 p.)

Po pierwsze nazywaj wszystko po angielsku. Przez 10 minut szukałem, dlaczego nic mi się nie formatuje, dopiero później wpadłem na świetny pomysł, że może jest zła implementacja pliku CSS.

Masz tutaj w flexie to zrobione, działać działa, ale nie wiem czy Cię to satysfakcjonuje.

https://jsfiddle.net/L60njo08/

P.S.

Nie wiem gdzie się uczyłeś, ale otwieranie klamry w CSS powinno być w tej samej linii co selektor, a nie oddzielone enterem. Nie wiem co to za nawyki, ale je zmień.

komentarz 28 marca 2016 przez niezalogowany

czyli nie dałem </style> i to był problem??

komentarz 28 marca 2016 przez Filip31411 Dyskutant (8,820 p.)

Serio masz do niego pretensje o to jak otwiera klamry selektora w css'ie ?

komentarz 28 marca 2016 przez arces Pasjonat (17,700 p.)

Kod ma być czytelny dla wszystkich, a nie dla niego samego. Jak chce pomocy powinien dostosować się do ogółu, a standardem jest to co napisałem.

Nie chodziło o style, tylko o to, że nie masz zdefiniowanej szerokości w main. Ja zrobiłem Ci to na flexie i to działa, ale nie wiem czy tak chcesz, bo to jest nowe rozwiązanie, które nie wspiera wszystkich przeglądarek.

komentarz 28 marca 2016 przez niezalogowany

pierwszy raz tworzę stronę w HTML5 a ostatni raz pisałem stronę 6 lat temu i trochę pozapominałem. Teraz już będę wiedzieć co i jak

komentarz 28 marca 2016 przez arces Pasjonat (17,700 p.)

Na początek przypomnij sobie podstawową wiedzę, bo powielasz niektóre właściwości niepotrzebnie, zapisy itp itd

Do tego design też się zmienił przez te 6 lat, więc dobrze jakbyś sobie zakodował coś na wzór.

komentarz 28 marca 2016 przez niezalogowany

właśnie robię prowizoryczną stronę dla forum żeby sobie przypomnieć, oraz poznać HTML

odpowiedź 28 marca 2016 przez niezalogowany
edycja 28 marca 2016

body
{
	margin: 0;
}

main
{
	margin: 0 auto;
	width: 800px;

	/* 
		kolor tła jako podgląd,
	 	gdzie znajduje się element <main>
	*/

	background-color: #81EFAD;

}
main:after{
	content: "";
	display: block;
	clear: both;
}

margin: auto działa tylko dla elementów o zdefiniowanej szerokości, wystarczy dodać do main interesujący Cie width.

main:after załatwia bałagan narobiony przez pływające elementy w main. (bez tego margin: auto dla main w tym przypadku nie zadziała)

body margin: 0; i pusta przestrzeń na górze znika : )