zurück zur Startseite
  


Zurück XHTMLforum > (X)HTML und CSS > CSS
Seite neu laden Komplettes DIV mit Text & Bild verlinken

Antwort
 
LinkBack Themen-Optionen Ansicht
  #1 (permalink)  
Alt 07.05.2011, 14:57
Neuer Benutzer
neuer user
Thread-Ersteller
 
Registriert seit: 07.05.2011
Beiträge: 7
proloser befindet sich auf einem aufstrebenden Ast
Standard Komplettes DIV mit Text & Bild verlinken

Ich möchte ein komplettes DIV mit Titel, Bild und Text verlinken.

Das ganze soll dann etwa so aussehen:
ad.jpg


Natürlich hab ich bereits etwas umgesetzt aber es funktioniert noch nicht so wie ich mir das vorstelle.

HTML-Code:
<style type="text/css">
html, body { 
    font-family: Verdana;
    background-color: #FFFFFF;
    margin: 0px;
    padding: 0px;
}
 
 
.ad_main {
    width: 234px;
}
 
 
.ad_title {
    width: 234px;
    font-size: 12px;
    font-weight: bold;
    margin-bottom: 5px;
}
 
 
.ad_img {
    float: left;
}
 
 
.ad_text {
    font-size: 11px;
}
 
 
.ad_link {
    display: block;
    text-decoration: none;
}
 
</style>
 
 
 
<div class="ad_main">
    <a href="http://www.example.net" class="ad_link">
        <span class="ad_title">Suchmaschine</span><br />
        <span class="ad_img"><img border="0" src="img.jpg" /></span>
        <span class="ad_text">Die weltweit größte und beste Suchmaschine im Internet.</span>
    </a>
</div>
Im IE wird es zwar richtig angezeigt aber das A-Element geht nicht über das ganze DIV (Der freie Platz - rechts neben dem Bild und unter dem Text - wird nicht verlinkt). Im FF ist zwar das komplette DIV verlinkt aber "margin" wird zB nicht berücksichtigt.


Ich hoffe ihr könnt mir weiterhelfen.

Gruß proloser
Mit Zitat antworten
Sponsored Links
  #2 (permalink)  
Alt 07.05.2011, 16:22
Erfahrener Benutzer
XHTMLforum-Mitglied
 
Registriert seit: 22.03.2006
Beiträge: 387
gaby sorgt für eine eindrucksvolle Atmosphäre
Standard

Zitat:
Zitat von proloser Beitrag anzeigen
Im IE wird es zwar richtig angezeigt aber das A-Element geht nicht über das ganze DIV (Der freie Platz - rechts neben dem Bild und unter dem Text - wird nicht verlinkt). Im FF ist zwar das komplette DIV verlinkt aber "margin" wird zB nicht berücksichtigt.
Für die vollständige Verlinkung der Fläche im IE, gib dem Link "Layout" durch eine passende Eigenschaft:

Über hasLayout ? das Konzept des hasLayout im IE/Win | Deutsche Übersetzung

'width: 100%' bietet sich an.


Grüße
gaby
Mit Zitat antworten
Sponsored Links
  #3 (permalink)  
Alt 07.05.2011, 17:20
Standardkatze
XHTMLforum-Kenner
 
Registriert seit: 06.02.2007
Beiträge: 1.820
gato ist einfach richtig nettgato ist einfach richtig nettgato ist einfach richtig nettgato ist einfach richtig nettgato ist einfach richtig nett
Standard

Zitat:
Zitat von proloser Beitrag anzeigen
Im FF ist zwar das komplette DIV verlinkt aber "margin" wird zB nicht berücksichtigt.
margin kann auch nicht verlinkt werden, da es nicht zum Elementinhalt gehört.
__________________
Über Internet Explorer 8:
Noch bis 8. April 2014 wird der Internet Explorer 6 mit Sicherheitsupdates versorgt.
Bereits jetzt kann dieser Browser aber vollständig durch den IE8 ersetzt werden. Ältere Betriebssysteme und Browserversionen werden von Microsoft nicht mehr unterstützt.
Auch Programme, die den IE7 benötigen, sind kein Argument gegen IE8, da dieser über entsprechende Kompatibilitätsschichten verfügt.
Ab sofort gilt daher der Internet Explorer 8 als vorausgesetzer Mindeststandard.
Mit Zitat antworten
  #4 (permalink)  
Alt 07.05.2011, 17:37
Erfahrener Benutzer
XHTMLforum-Mitglied
 
Registriert seit: 22.03.2006
Beiträge: 387
gaby sorgt für eine eindrucksvolle Atmosphäre
Standard

Zitat:
Zitat von proloser Beitrag anzeigen
Im FF ist zwar das komplette DIV verlinkt aber "margin" wird zB nicht berücksichtigt.
Das kommt daher, weil der Seitentitel in einem <span>, also einem Inline-Element, eingeschlossen ist.

Auf Inline-Elemente lassen sich keine vertikalen margins anwenden.

Auf Block-Elemente, und Inline-Elemente mit Block-Eigenschaften, schon eher.
Mit Zitat antworten
  #5 (permalink)  
Alt 07.05.2011, 18:33
Neuer Benutzer
neuer user
Thread-Ersteller
 
Registriert seit: 07.05.2011
Beiträge: 7
proloser befindet sich auf einem aufstrebenden Ast
Standard

Alles klar, ich hab jetzt verstanden warum es nicht funktioniert. Könnt ihr mir vielleicht noch Lösungsvorschläge geben, denn ich weiß momentan nicht, wie ich das Problem lösen könnte.

Gruß proloser
Mit Zitat antworten
  #6 (permalink)  
Alt 07.05.2011, 18:53
Standardkatze
XHTMLforum-Kenner
 
Registriert seit: 06.02.2007
Beiträge: 1.820
gato ist einfach richtig nettgato ist einfach richtig nettgato ist einfach richtig nettgato ist einfach richtig nettgato ist einfach richtig nett
Standard

Zitat:
Zitat von proloser Beitrag anzeigen
Alles klar, ich hab jetzt verstanden warum es nicht funktioniert. Könnt ihr mir vielleicht noch Lösungsvorschläge geben, denn ich weiß momentan nicht, wie ich das Problem lösen könnte.

Gruß proloser
Dazu müsstest du uns verraten, worin dein Problem aktuell noch besteht. Wenn du die Ursache kennst, solltest du der Wirkung doch entgegentreten können.

Der vollständige Quelltext bzw eine Testseite online wäre hier sehr nützlich.
__________________
Über Internet Explorer 8:
Noch bis 8. April 2014 wird der Internet Explorer 6 mit Sicherheitsupdates versorgt.
Bereits jetzt kann dieser Browser aber vollständig durch den IE8 ersetzt werden. Ältere Betriebssysteme und Browserversionen werden von Microsoft nicht mehr unterstützt.
Auch Programme, die den IE7 benötigen, sind kein Argument gegen IE8, da dieser über entsprechende Kompatibilitätsschichten verfügt.
Ab sofort gilt daher der Internet Explorer 8 als vorausgesetzer Mindeststandard.
Mit Zitat antworten
  #7 (permalink)  
Alt 07.05.2011, 19:09
Erfahrener Benutzer
XHTMLforum-Mitglied
 
Registriert seit: 22.03.2006
Beiträge: 387
gaby sorgt für eine eindrucksvolle Atmosphäre
Standard

Zitat:
Zitat von proloser Beitrag anzeigen
Alles klar, ich hab jetzt verstanden warum es nicht funktioniert. Könnt ihr mir vielleicht noch Lösungsvorschläge geben, denn ich weiß momentan nicht, wie ich das Problem lösen könnte.
Okay, ich fasse ich es nochmal in andere Worte:
Wenn du ein margin-top oder margin-bottom deklarieren willst, wirkt das nur auf Block-Elemente, und Inline-Elemente mit Block-Eigenschaften.

3.4 Block- und Inline-Elemente - Little Boxes - Webseiten gestalten mit HTML und CSS (von Peter Müller)

Ein span (=Inline-Element) kannst du mit einem entsprechenden Wert für die display-Eigenschaft dazu bringen, daß es sich wie ein Block-Element verhält.
Mit Zitat antworten
  #8 (permalink)  
Alt 08.05.2011, 14:16
Neuer Benutzer
neuer user
Thread-Ersteller
 
Registriert seit: 07.05.2011
Beiträge: 7
proloser befindet sich auf einem aufstrebenden Ast
Standard

Super, so versteh es sogar ich
Danke, jetzt funktioniert alles!

Gruß proloser
Mit Zitat antworten
Antwort

Stichwörter
anzeige, div, elemtn, link, verlinken

Themen-Optionen
Ansicht

Forumregeln
Es ist Ihnen nicht erlaubt, neue Themen zu verfassen.
Es ist Ihnen nicht erlaubt, auf Beiträge zu antworten.
Es ist Ihnen nicht erlaubt, Anhänge hochzuladen.
Es ist Ihnen nicht erlaubt, Ihre Beiträge zu bearbeiten.

BB-Code ist an.
Smileys sind an.
[IMG] Code ist an.
HTML-Code ist aus.
Trackbacks are an
Pingbacks are an
Refbacks are aus


Ähnliche Themen
Thema Autor Forum Antworten Letzter Beitrag
Parent DIV soll mit der Höhe seines Childs wachsen Tekkla CSS 2 19.11.2009 19:27
Problem mit div und Höhe deep4 CSS 2 13.11.2007 21:03
Falsche Darstellung beim Internet Explorer LordAvalon CSS 4 09.04.2007 17:22
bild über 2 div-tags positionieren MoJo CSS 7 12.06.2006 17:48
CSS - Design (clear - Problem) -Oliver- CSS 11 21.12.2005 22:48


Alle Zeitangaben in WEZ +2. Es ist jetzt 10:54 Uhr.