Witaj Gościu! ( Zaloguj | Rejestruj )

Forum PHP.pl

> [html] problem z menu opartym na divach, a dokładniej ze wskazaniami walidatora w3c
tomkoz11
post
Post #1





Grupa: Zarejestrowani
Postów: 12
Pomógł: 0
Dołączył: 16.03.2006

Ostrzeżenie: (0%)
-----

Mam następujący problem - nie wiem jak przerobić menu, aby to było uznawane za zgodne ze standardami przez walidator w3c.
Wiem o co chodzi - że div jako element blokowy, nie może znajdować się w <a></a>, tyle że nie mam pomysłu jak to przerobić by było wszystko ok w walidatorze. O usunięciu divów nie ma co rozmawiać bo one są niezbędne, gdyż wykorzystuję je do uzyskania efektu podświetlenia onmouseover, a jeżeli <a> umieściłbym już w divach to trzeba by się było napracować, żeby w ogóle trafić w link. ;/ Mój Doctype to HTML 4.01 Strict

Przykładowy link w menu wygląda tak:

[HTML] pobierz, plaintext 
  1. <a href="index.htm"><div class="link_menu">STRONA GŁÓWNA</div></a>
[HTML] pobierz, plaintext


Komunikaty które zwraca walidator:

Cytat
document type does not allow element "DIV" here; missing one of "APPLET", "OBJECT", "MAP", "IFRAME", "BUTTON" start-tag

Cytat
The mentioned element is not allowed to appear in the context in which you've placed it; the other mentioned elements are the only ones that are both allowed there and can contain the element mentioned. This might mean that you need a containing element, or possibly that you've forgotten to close a previous element.

One possible cause for this message is that you have attempted to put a block-level element (such as "<p>" or "<table>") inside an inline element (such as "<a>", "<span>", or "<font>").
Go to the top of the page
+Quote Post
 
 Start new topic
Odpowiedzi (1 - 7)
gekon
post
Post #2





Grupa: Zarejestrowani
Postów: 614
Pomógł: 7
Dołączył: 10.11.2003
Skąd: Rzeszów/Kraków

Ostrzeżenie: (0%)
-----

Na przykład tak:
[HTML] pobierz, plaintext 
  1. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
  2. <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="pl" lang="pl">
  3. <head>
  4.   <title>Menu</title>
  5.   <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
  6.   <style type="text/css">
  7.   #menu { list-style: none; }
  8.   #menu li { float: left; }
  9.   #menu li  a { padding: 0.5em; background-color: #F00; }  
  10.   </style>
  11. </head>
  12. <body>
  13. 	<ul id="menu">
  14. 		<li><a href="#">Strona główna</a></li>
  15. 		<li><a href="#">Inna strona</a></li>
  16. 	</ul>	
  17. </body>
  18. </html>
[HTML] pobierz, plaintext


Oglądnij też Listamatic.


--------------------
Pokaż kod = Pokaż CAŁY kod, najlepiej działający na jakimś serwerze.
Fanatycy | glazar.info | semantyka | HTML i XHTML FAQ
Go to the top of the page
+Quote Post
kwiateusz
post
Post #3


Admin Techniczny


Grupa: Administratorzy
Postów: 2 071
Pomógł: 93
Dołączył: 5.07.2005
Skąd: Olsztyn
a może zwyczajnie zamień div na span? elementy liniowe mogą się zawierać w sobie...
Go to the top of the page
+Quote Post
babejsza
post
Post #4





Grupa: Zarejestrowani
Postów: 407
Pomógł: 1
Dołączył: 4.03.2003
Skąd: warszawa

Ostrzeżenie: (0%)
-----

To nie dobrze bo powinny wyglądać tak jak to już napisał Ci @gekon.

Linki w menu są niczym innym jak listą nieuporządkowaną, a skoro tak to należy je przypisać do odpowiednich znaczników.
Go to the top of the page
+Quote Post
E -dd
post
Post #5





Grupa: Zarejestrowani
Postów: 71
Pomógł: 0
Dołączył: 18.12.2006
Skąd: Warszawa

Ostrzeżenie: (0%)
-----

Kod
<div><a></a></div>

W takiej kolejności powinno być smile.gif


--------------------
Program TV, Sukces internetowy, Forum dla administratorów stron
Go to the top of the page
+Quote Post
envp
post
Post #6





Grupa: Zarejestrowani
Postów: 359
Pomógł: 1
Dołączył: 16.04.2006
Skąd: Łódź

Ostrzeżenie: (0%)
-----

Myślę, że to co napisał @gekon jesy najbardziej sensowne, sprawdzone i poprawne...
Go to the top of the page
+Quote Post
tomkoz11
post
Post #7





Grupa: Zarejestrowani
Postów: 12
Pomógł: 0
Dołączył: 16.03.2006

Ostrzeżenie: (0%)
-----

Wydaję mi się, że nie do końca zrozumieliście mój problem. Ten kod CSS powinien wyjaśnić o co mi dokładnie chodziło :
[HTML] pobierz, plaintext 
  1. <a href="index.htm"><span class="link_menu">STRONA GŁÓWNA</span></a>
[HTML] pobierz, plaintext 

[HTML] pobierz, plaintext 
  1. .link_menu
  2. {
  3.     display: block;
  4.     background-image: url(gfx/menu1.png);
  5.     width: 149px;
  6.     height: 25px;
  7.     vertical-align: bottom;
  8.     font-family: sans-serif;
  9.     font-size: medium;
  10.     color: #000000;
  11.     text-align: center;
  12.     border-style: none;
  13. }
  14. .link_menu:hover
  15. {
  16.     display: block;
  17.     background-image: url(gfx/menu2.png);
  18.     width: 149px;
  19.     height: 25px;
  20.     vertical-align: top;
  21.     font-family: sans-serif;
  22.     font-size: medium;
  23.     color: #000000;
  24.     text-align: center;
  25.     border-style: none;
  26.     text-decoration: none;
  27. }
[HTML] pobierz, plaintext

Problem został już rozwiązany, więc temat może w mojej opinii zostać zamknięty. winksmiley.jpg
Go to the top of the page
+Quote Post
gekon
post
Post #8





Grupa: Zarejestrowani
Postów: 614
Pomógł: 7
Dołączył: 10.11.2003
Skąd: Rzeszów/Kraków

Ostrzeżenie: (0%)
-----

Nie, my bardzo dobrze zrozumieliśmy Twój problem smile.gif To Ty nie zrozumiałeś naszych wskazówek smile.gif Ale praktyka przychodzi z czasem.


--------------------
Pokaż kod = Pokaż CAŁY kod, najlepiej działający na jakimś serwerze.
Fanatycy | glazar.info | semantyka | HTML i XHTML FAQ
Go to the top of the page
+Quote Post
« Następny starszy · HTML \ XHTML · Następny nowszy »
 

Reply to this topicStart new topic
1 Użytkowników czyta ten temat (1 Gości i 0 Anonimowych użytkowników)
0 Zarejestrowanych:

 

Tryb wyświetlania: Przełącz na: Standardowy · Linearny+ · Przełącz na: Drzewo

Śledź ten temat · Wyślij temat na e-mail · Wydrukuj ten temat · Subskrybuj to forum

RSS Aktualny czas: 20.08.2025 - 10:31
Powered By IP.Board © 2025  IPS, Inc.
All changes by PHP.pl Administrators
Hosting zapewnia NQ.pl hosting, trac, svn