Frage stellen
Ich habe natürlich ein CSS-Problem, vielleicht ist es sogar ein reines HTML-Problem. Und eigentlich ist es sogar simpel, denke ich. Andererseits, es geht um etwas derart Elementares, dass ich schon an meinem Verstand zweifle, denn etwas Ahnung von der Materie hab ich doch.
Folgendes:
Ich habe ein Bild per float:left links positioniert. Der anschliessende Absatz soll rechts davon stehen und unterhalb des Bildes wieder die komplette verfügbare Breite einnehmen. Das Bild ist als Hyperlink definiert. Ohne Link gibt es kein Problem.
Wenn ich den Code auf's einfachste minimiere, klappt es auch, im konkreten Fall aber ist oben rechts vom Bild jedoch noch ein kleiner anklickbarer Bereich, mein Absatz steht nun eine Zeile tiefer und nicht wie gewünscht oben bündig mit dem Bild.
Woran könnte das liegen?
Hier mal der Code, welcher in dieser einfachen Fom jedoch kein Problem macht:
- Code: Alles auswählen
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<title>test</title>
<style type="text/css">
<!--
#bild {
float: left;
margin-right: 20px;
}
-->
</style>
</head>
<body>
<p>Lorem ipsum dolor sit amet, consectetuer adipiscing
elit. Donec fermentum. Fusce vitae lorem. Curabitur
sapien mauris, fringilla sed, feugiat et, scelerisque
eu, augue. Cras quam erat, lobortis ut, sagittis eu,
convallis eu, nunc. Sed odio nibh, venenatis id, rutrum
sit amet, dignissim vel, dui. Cras sed purus. Phasellus
id quam nec tortor egestas scelerisque. Aenean dui mi,
tincidunt eu, nonummy id, euismod laoreet, ligula. Cras
eleifend ullamcorper tortor. Praesent vehicula turpis
non ipsum. Curabitur tincidunt aliquet urna. Nulla
facilisi. Donec a ligula.
</p>
<a href="#"><img id="bild" src="bild.jpg" width="100" height="100" border="0" alt=""></a>
<p>Lorem ipsum dolor sit amet, consectetuer adipiscing
elit. Donec fermentum. Fusce vitae lorem. Curabitur
sapien mauris, fringilla sed, feugiat et, scelerisque
eu, augue. Cras quam erat, lobortis ut, sagittis eu,
convallis eu, nunc. Sed odio nibh, venenatis id, rutrum
sit amet, dignissim vel, dui. Cras sed purus. Phasellus
id quam nec tortor egestas scelerisque. Aenean dui mi,
tincidunt eu, nonummy id, euismod laoreet, ligula. Cras
eleifend ullamcorper tortor. Praesent vehicula turpis
non ipsum. Curabitur tincidunt aliquet urna. Nulla
facilisi. Donec a ligula.
</p>
</body>
</html>
Im konkreten Anwendungsfall ist es nicht das IMG, welches sich seltsam verhält, sondern nur das A, also der Hyperlink um das Bild.
Hoffe ihr versteht, wie ich das meine und das mir jemand weiterhelfen kann...
Grüße, Charly
: