Vai al contenuto

div con link e standard w3c


dieguito

Messaggi raccomandati

Ciao a tutti,

ho un piccolo problema con un sito che sto sviluppando..

ho un div con immagine di sfondo come header del mio sito, e cliccando sull'immagine mi riporta alla home del sito..

il codice è questo:

HTML
<a href="www.sito.com/home.php">
<div id="header"></div>
</a>
.......
CSS
#header
{
background:url(header.png);
}

il problema è che il w3c non accetta che un elemento block(div) sia contenuto in un elemento inline(a)..

Come posso renderlo conforme agli standard?

devo per forza inserire l'immagine con il tag img all'interno link?

spero di essermi spiegato bene...:ghghgh:

Link al commento
Condividi su altri siti

Ospite VonNeumann

Siccome in questo caso non hai a che fare con testo ma solo con un immagine di sfondo buoi forzare, tramite css, l'elemento inline ad essere visualizzato come elemento block impostando in esso l'immagine di background!

HTML
<a href="www.sito.com/home.php" id="header"></a>
.......
CSS
#header{
display: block;
width: ;
height: ;
background: url(header.png) no-repeat;
}

Link al commento
Condividi su altri siti

Non solo quello che stai facendo va contro il W3c... ma e' anche semanticamente incorretto... non puoi wrappare un DIV in un 'a' tag...

La soluzione sarebbe seguire un approccio del genere:

<div id="hd">

<div id="logo">

<h1><span>Nome del tuo sito, quello che fa il tuo sito</span></h1>

</div>

<div id="nav-primary">

<ul>

<li>bla bla bla</li>

</ul>

</div>

</div>

<div id="bd">

</div>

CSS

h1 span { display: none; }

#logo { display:block; ... }

In questo caso potrai usare l'hd (header) come wrapper...

cmq... tutto dipende dal design che stai cercando di implementare... in ogni caso un bel corso di html ti aiuterebbe a comprendere il perche' quello che stavi tentando di fare e' sbagliato.

Ps. Mi sono dilungato sulla primary nav in quanto non sono sicuro sul come la stai affrontando...

Bye

If you know the enemy and know yourself, you need not fear the result of a hundred battles. If you know yourself but not the enemy, for every victory gained you will also suffer a defeat. If you know neither the enemy nor yourself, you will succumb in every battle.

Link al commento
Condividi su altri siti

ok grazie, ma noboruwatanabe ma nn hai capito esattamente cosa volevo fare.. forse mi sono spiegato male.. comunque, so che quello che ho scritto non è semanticamente corretto, ma la necessità di inserire un link è venuta dopo, quando ormai il layout era già impostato ed ho ho cercato di "accrocchiare"..

risolverò in un altra maniera.. e anche se c'è sempre da imparare, non credo di aver bisogno di un corso di html..

Link al commento
Condividi su altri siti

<div id="container">	
	<a href="index.php"><div id="header"/></a>

	<div id="menu">
		<ul>
			<li><a href="index.php">Home</a></li>
			<li><a href="chisiamo.php">Chi siamo</a></li>
			<li><a href="dovesiamo.php">Dove siamo</a></li>
			<li><a href="menu.php">Il nostro Menù</a></li>
			<li><a href="gallery.php">Gallery</a></li>
			<li><a href="contatti.php">Contatti</a></li>
		</ul>
	</div>
	<div id="inizio"/>
	<div id="page">
	<img src="img/home_sez.png" id="sezione" alt="Home"/>		<br/><br/>

Io un corso di HTML me lo farei proprio... e non prenderla a male... ma:

1) come detto prima 'a' tag che wrappano DIV non hanno alcun senso logico... neppure se hai solo provato a rattopare...

2) che senso ha avere un header vuoto e tenere la navigazione al di fuori?

come ti avevo gia' indicato sopra (e ti assicuro che non avevo visto quello che avevi scritto (e parlo di codice))... dovresti utilizzare un diverso approccio e dare un senso a ogni parte del sito non solo a livello di contenuto... ma anche a livello strutturale.

Saluti

:ghghgh:

If you know the enemy and know yourself, you need not fear the result of a hundred battles. If you know yourself but not the enemy, for every victory gained you will also suffer a defeat. If you know neither the enemy nor yourself, you will succumb in every battle.

Link al commento
Condividi su altri siti

allora:

1)ovvio che non ha senso, ma era per avere il link alla pagina iniziale cliccando sul logo

2)l'header non è vuoto ma contiene un immagine(background:url() nel css) con il logo dell'azienda, e poi che centra la navigazione con l'header? possono benissimo essere separate..

esempio:

http://www.html.it/guide/esempi/layout_css/esempio12.html

non che la prendo a male, ma è molto fastidioso essere giudicati senza conoscere e senza argomentazioni valide..

cmq ringrazio lo stesso..

saluti:fiorellino:

Link al commento
Condividi su altri siti

1) Una immagine come background in CSS equivale a un header vuoto... in quanto disabilitando i css (vedi screen reader e altro) all'utente risulta nient'altro che un header vuoto... quindi che senso ha averlo? Una immagine di background la puoi mettere sotto qualunque cosa e ha piu senso metterla su un H1 con il titolo del sito piuttosto che dove l'hai messa tu...

2) La navigazione non necessariamente e' parte dell'header ma nel tuo sito lo e' anche se nel tuo codice no... ti rendi conto che scrivi una cosa e fai apparire un'altra?

Non ha senso quello che fai... e ti assicuro che non servono argomentazioni valide per stabilirlo... quindi si ritorna al consiglio iniziale... perche non fai un corso di html... oppure ti butti su iWeb & CO?

If you know the enemy and know yourself, you need not fear the result of a hundred battles. If you know yourself but not the enemy, for every victory gained you will also suffer a defeat. If you know neither the enemy nor yourself, you will succumb in every battle.

Link al commento
Condividi su altri siti

Perche' se noti... il tuo sito e' strutturato in questo modo, almeno a livello visuale:

<header>

<logo><h1><a><span> <-- Basta nascondere { h1 span } nei css e ti ritrovi con un link clikkabile

<navigazione> <-- che resta costante per tutto il sito, per questo va messa nell'header

</header>

<content>

Qui va il contenuto che cambia di pagina in pagina

</content>

<footer>

ipr etc...

</footer>

A livello di codice questa e' la rappresentazione, da notare che dando display block e una misura esplicita al div logo ti ritrovi con l'intero header della pagina clickabile in quanto il div logo va a soprapporre l'header.

Saluti

If you know the enemy and know yourself, you need not fear the result of a hundred battles. If you know yourself but not the enemy, for every victory gained you will also suffer a defeat. If you know neither the enemy nor yourself, you will succumb in every battle.

Link al commento
Condividi su altri siti

non condivido appieno, ma ti ringrazio comunque.. ho risolto seguendo più o meno ciò che mi hai detto.. comunque permettimi di darti un consiglio ora:

la prossimo volta, non fare questi interventi così boriosi.. questo è un forum, ed è fatto apposta per condividere opinioni, chiedere e dare consigli.. non per dire "io ne so di più".. non è corretto.. io sono all'inizio in html,css e quant'altro.. ma sicuramente saprei dare consigli a molte altre persone, ma non mi permetterei mai di dire "fatti un corso di html" o "datti ad iweb&co".. capito? non è bello... dovresti regolare certi interventi, o perlomeno farli in un modo più garbato.. personale opinione eh.. non prenderla a male..

saluti

Link al commento
Condividi su altri siti

Non mi sembra di averti scritto in nessun posto 'io ne so piu di te'... se poi lo hai dedotto tu e' un altro paio di maniche...

...sei all'inizio di HTML e CSS... ergo come ti ho consigliato nel mio primo intervento... fatti un corso di HTML...

Ho solo analizzato l'evidenza... se quello che hai scritto (e mi riferisco al codice) e' quello che hai scritto... non andare avanti a scriverlo... o tantomeno non dare consigli a chi inzia (onde evitare di iniziare col piede sbagliato).

E ti assicuro che non lo dico per male, non si imparano questo genere di cose facendo prove, ci sono milioni di corsi online e offline che ti possono aiutare a migliorare in quello che stai facendo.

Questo e' il mio punto di vista, mi dispiace se ti urta.

Cordiali saluti

If you know the enemy and know yourself, you need not fear the result of a hundred battles. If you know yourself but not the enemy, for every victory gained you will also suffer a defeat. If you know neither the enemy nor yourself, you will succumb in every battle.

Link al commento
Condividi su altri siti

beh l'attegiamento era quello.. sono agli inizi nel senso che è il mio primo sito "ufficiale".. ma essendo laureando in informatica, l'argomento "HTML" e dintorni l'ho già affrontato parecchie volte... e poi sinceramente ho fatto vedere il mio lavoro a parecchie persone e non l'hanno giudicato così male.. addirittura "non andare avanti a scriverlo"..non credi sia un pò esagerato?.. potevo ancora ancora capire, se avessi usato le tabelle per impostare il layout.. sarei curioso di vedere un tuo lavoro, ma non per giudicare eh, sia chiaro(non me lo posso permettere, e comunque non lo farei).. giusto per capire cosa c'è di tanto "sbagliato" nel mio codice... e poi consigliare addirittura iweb.. ma daiiii.. e come se chiedessi ad un cuoco consigli per fare un piatto di spaghetti alla carbonara e lui ti consigliasse di andare a prendere un panino da Mc Donald...

questa non la chiami superiorità?.. vabbè comunque no problem.. chiudiamola qua..

ancora grazie per l'aiuto..

Saluti

Link al commento
Condividi su altri siti

Archiviato

Questa discussione è archiviata e chiusa a future risposte.

×
×
  • Crea Nuovo...