"hackeliger" link
lima-city → Forum → Die eigene Homepage → HTML, CSS & Javascript
absatz
after
auktion
blocken
code
element
entfernen
fehler
gesamten box
gucken
gut code
hesse
http
listen
praxis
problem
sagen
span
url
weisheit
-
Hallo
Ich habe mehrere simple links:
erste Seite, zurück,vor,letzte Seite
<< ,<,>,>>
<div class="navi" > <a href="?swf&kat=1&seite=1&id=64#t" title="erste Seite" ><<</a> <a href="?swf&kat=1&seite=1&id=64#t" title="zurück" >< </a> <span class="act">Seite 2-3</span> <a href="?swf&kat=1&seite=3&id=64#t" title="vor"><span> ></span></a> <a href="?swf&kat=1&seite=131&id=64#t" title="letzte Seite" >>></a> </div>
css code:
.navi {float: left; padding: 0 10px;} .navi a{padding: 0 10px; font-weight: bold; border: solid 1px #bbf; border-color: #47a #147 #147 #369 ; margin:8;}
hier könnt ihr sie euch "live" anschauen (oben die Blauen Kästen)
Mein Problem:
Man kann nur die links klicken wenn man auf die Zeichen klickt, nicht aber innerhalb der gesamten Box, die ich in navi a definiert habe.
Wie kann ich erreichen das auch im padding-bereich ein klick wirkt?
-
Diskutiere mit und stelle Fragen: Jetzt kostenlos anmelden!
lima-city: Gratis werbefreier Webspace für deine eigene Homepage
-
Als erstes solltest du mal deinen code aufräumen, ein div innerhalb eines span geht gar nicht, dann solltest du mal gucken was du wie und wo definierst und zu guterletzt, ist dein problem nicht die navi, sonder das div mit der Klasse "Kat_tools", dem div gibst du einfach overflow:hidden; im css dann gehts!
-
nemoinho schrieb:
Als erstes solltest du mal deinen code aufräumen, ein div innerhalb eines span geht gar nicht, dann solltest du mal gucken was du wie und wo definierst und zu guterletzt, ist dein problem nicht die navi, sonder das div mit der Klasse "Kat_tools", dem div gibst du einfach overflow:hidden; im css dann gehts!
Danke es wirkt tatsächlich.
Ok ich werde span-elemente in div umwandeln (oder entfernen, je nachdem).
Magst Du mich noch mit Deiner Weisheit erhellen und mir sagen :
1-Warum wirkt das overflow: hidden;
2-was ist Böse an divs in span elementen (oder meintest du eventuell anders herum?)
Ich will ja immer auch lernen
edit: Da war kein einziges div-inspan-element, weiss nicht was Du hast.
Ich hatte in den <a> elementen <span>-elemente. Jetzt wieder entfernt...
Aktuell ist nur ein span-in-div-element vorhanden (<span class="act">Seite x-x</span>)
Beitrag zuletzt geändert: 20.4.2010 21:31:15 von simuliertes -
Das mit dem overflow ist so definiert, siehe hier: http://www.w3.org/TR/CSS2/visuren.html#block-formatting
und gängige Praxis :)
eine andere Variante ist ein Pseudoelement zu erzeugen dass den float abbricht, dann muss man nur noch dem umschließenden Element die Klasse clearfix geben, aber das funktioniert manchmal nicht so gut...
ich hab selber mal 2 Beispiele wie ich mittels float den content formatiere:.clearfix:after { content:"."; display:block; width:100%; clear:both; height:0; visibility:hidden; }
http://nemoinho.lima-city.de (Das CSS ist sehr durcheinander...) und http://nemoinho.kilu.de
So und nun zu den spans und divs, grob gesagt, je weniger fehler im Quelltext sind, desto weniger Probleme/Fehler gibt es meist auch bei der Darstellung.
Du hast mehrere div in einem span, den das span in zeile 44 und auch der anschließende link werden nicht geschlossen. (a ist übrigens auch inline!)
Und ein Fehler ist auch ein span innerhalb eines div, denn ein div ist ein block-element (erzeugt einen absatz, außer durch css umgestellt!) und span ein inline element. Nun das Problem, ein Block-Element kann nur innerhalb eines anderen Block-Elements stehen oder innerhalb eines Listen-Punktes einer numerrierten, bzw einer unsortierten Liste<ol><li><p>p ist ein Block-Element</p></li></ol> <ul><li><p>p ist ein Block-Element</p></li></ul>
Ich hoffe das reicht vorrerst ich helfe aber gerne auch noch weiter.
Beitrag zuletzt geändert: 20.4.2010 21:51:25 von nemoinho -
Diskutiere mit und stelle Fragen: Jetzt kostenlos anmelden!
lima-city: Gratis werbefreier Webspace für deine eigene Homepage