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

question-closed Nie działające znaczniki w HTML!

Object Storage Arubacloud
0 głosów
319 wizyt
pytanie zadane 2 kwietnia 2017 w HTML i CSS przez Śwież4k Bywalec (2,570 p.)
zamknięte 2 kwietnia 2017 przez Śwież4k

Mam problem, ponieważ nie rozumiem czemu jak dodałem znacznik <ol> to nie wyświetlają się numery obok wyrazów. Nie działa również prawy margines i padding. Możecie pomóc mi zlokalizować problem?

Kod HTML

<!DOCTYPE HTML>
<HEAD>
<link rel="stylesheet" href="indexx2.css" type="text/css" />
</head>
<body>
<div id="header">
<h2> Nagłówek </h2>
</div>
<div id="body">
<div id="leftcol">
<p> MENU </p>

		

		<a href="index.html">powrót

		<a href="http://onet.pl">ONET </a>

	
</div>
<div id="main">
<h3> E14 </h3>
<ol>
<li>lista 1</li>
<li>lista 2</li>
<li>lista 3 </li>
</ol>
<p> Lorem ipsum dolor sit amet enim. Etiam ullamcorper. Suspendisse a pellentesque dui, non felis. Maecenas malesuada elit lectus felis, malesuada ultricies. Curabitur et ligula. Ut molestie a, ultricies porta urna. Vestibulum commodo volutpat a, convallis ac, laoreet enim. Phasellus fermentum in, dolor. Pellentesque facilisis. Nulla imperdiet sit amet magna. Vestibulum dapibus, mauris nec malesuada fames ac turpis velit, rhoncus eu, luctus et interdum adipiscing wisi. Aliquam erat ac ipsum. Integer aliquam purus. Quisque lorem tortor fringilla sed, vestibulum id, eleifend justo vel bibendum sapien massa ac turpis faucibus orci luctus non, consectetuer lobortis quis, varius in, purus. Integer ultrices posuere cubilia Curae, Nulla ipsum dolor lacus, suscipit adipiscing. Cum sociis natoque penatibus et ultrices volutpat. Nullam wisi ultricies a, gravida vitae, dapibus risus ante sodales lectus blandit eu, tempor diam pede cursus vitae, ultricies eu, faucibus quis, porttitor eros cursus lectus, pellentesque eget, bibendum a, gravida ullamcorper quam. Nullam viverra consectetuer. Quisque cursus et, porttitor risus. Aliquam sem. In hendrerit nulla quam nunc, accumsan congue. Lorem ipsum primis in nibh vel risus. Sed vel lectus. Ut sagittis, ipsum dolor quam.</p>
</div>
</div>

<div id="bot">
<p> Michał, Patryk </p>
</div>

CSS

 

* {
	margin:0;
	padding:0;
	 display: block;
	width: 100%;
    overflow:hidden;
}

#header {
	
	width: 900px;
	height: 100px;
	background-color: #DDDDDD;
	margin-left: auto;
	margin-right: auto;
	margin-top:7%;
}
#main { 
width:750px;
height:400px;
background-color: #CCCCCC;





}
#leftcol {
	width: 150px;
	height:400px;
	background-color:#BBBBBB;
	float:left;

	
	
}



#body {
	width:900px;
	height:400px;
		margin-left: auto;
margin-right: auto;
}
#bot {
	
	width: 900px;
	height: 100px;
	background-color: #888888;
	margin-left: auto;
margin-right: auto;
	
}

h2 {
text-align: CENTER;
	margin-top:2%;
	
	
}

h3 {
text-align: CENTER;
	margin-top:2%;
}

#bot > p {
text-align: center;
	margin-top:2%;
}

#leftcol > p {
text-align: center;
	margin-top:2%;
}
#leftcol > a {
	
	margin-top:2%;
text-align: center;
	
}


ol > li {
float : left;
display: block;
width : 200px;
text-align:center;
margin-top: 20px;
position:relative;
left: 10%


}

#main > p {
	
	margin-top:9px;
	margin-left: 8px;
	margin-right: 8px;
	text-align:justify;
	
}











 

komentarz zamknięcia: nie działą
komentarz 2 kwietnia 2017 przez spamator12 Nałogowiec (28,230 p.)
left: 10%

dodaj srednik
komentarz 2 kwietnia 2017 przez Śwież4k Bywalec (2,570 p.)
nie pomogło
komentarz 9 czerwca 2017 przez Gankkah Użytkownik (720 p.)
Co oznacza * ?????

3 odpowiedzi

0 głosów
odpowiedź 2 kwietnia 2017 przez spamator12 Nałogowiec (28,230 p.)
nastepnym razem dawaj to w jsfiddle codepen albo plunkr

 

https://embed.plnkr.co/q8Uwk5SL4oLgiMdyXC9u/
komentarz 2 kwietnia 2017 przez Śwież4k Bywalec (2,570 p.)
w prawym górnym rogu masz przecież przekierowanie
0 głosów
odpowiedź 2 kwietnia 2017 przez Ivan Maniak (60,650 p.)

ol nie ma liczb obok, ponieważ nadałeś mu display: block, a tak właściwie to li, a powinien mieć display: list-item.

P.S. Dodatkowo nadałeś WSZYSTKIM znacznikom display: block. Zrobiłeś to także dla znacznika title (którego nie ma w dokumencie), stylescript, itd. Będą one widoczne po dodaniu.

komentarz 2 kwietnia 2017 przez Śwież4k Bywalec (2,570 p.)

Jak zamieniłem to dalej nie działa sad

–1 głos
odpowiedź 2 kwietnia 2017 przez imklau Nałogowiec (42,090 p.)

sam przecież ustawiłeś na wszystkie elementy takie coś:

* {
    margin:0;
    padding:0;
    display: block;
    width: 100%;
    overflow:hidden;
}

 

komentarz 2 kwietnia 2017 przez Śwież4k Bywalec (2,570 p.)
nawet jak się pozbędę tego display: block z całego dokumentu to i tak nie działa.
komentarz 2 kwietnia 2017 przez imklau Nałogowiec (42,090 p.)
usunąłeś display: block z tego co wstawiłam i też ze stylowania li? i nadal nie wyświetlają się numerki przy liście?
komentarz 2 kwietnia 2017 przez Śwież4k Bywalec (2,570 p.)
komentarz 2 kwietnia 2017 przez imklau Nałogowiec (42,090 p.)
dodatkowo overflow: hidden musisz usunąć z * i jest ok
komentarz 2 kwietnia 2017 przez Śwież4k Bywalec (2,570 p.)
.hethetht
komentarz 2 kwietnia 2017 przez imklau Nałogowiec (42,090 p.)
to postaraj się zrobić stronę bez tego overflow dla wszystkich elementów ;)

Podobne pytania

0 głosów
2 odpowiedzi 771 wizyt
pytanie zadane 8 grudnia 2016 w HTML i CSS przez remo82 Użytkownik (560 p.)
0 głosów
1 odpowiedź 104 wizyt
pytanie zadane 23 listopada 2016 w HTML i CSS przez Maksym Piętak Nowicjusz (210 p.)
0 głosów
0 odpowiedzi 696 wizyt

92,583 zapytań

141,434 odpowiedzi

319,669 komentarzy

61,966 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!

...