zurück zur Startseite
  


Zurück XHTMLforum > (X)HTML und CSS > (X)HTML
Seite neu laden Link über ganze Tabellenzelle?

Antwort
 
LinkBack Themen-Optionen Ansicht
  #1 (permalink)  
Alt 27.06.2006, 13:16
Neuer Benutzer
neuer user
Thread-Ersteller
 
Registriert seit: 05.03.2006
Beiträge: 11
phpfuchs befindet sich auf einem aufstrebenden Ast
Standard Link über ganze Tabellenzelle?

Hallo!

Ich möchte einen Monatskalender über eine Tabelle darstellen, dabei soll jede Tabellenzelle anklickbar bar.

Ich kenne nur eine nicht-XHTML-konforme Lösung:
Code:
<a href="{link}"><td>{text}</td></a>
Ist zwar nicht HTML-konform, aber die Browser unterstützen es trotzdem.

Bei der Lösung
Code:
<td><a href="{link}">{text}</a></td>
muss man direkt auf den Text klicken, um weiter zu kommen.

Weiß jemand eine HTML-konforme Lösung, bei der es reicht, irgendwo auf die Zelle zu klicken?
Mit Zitat antworten
Sponsored Links
  #2 (permalink)  
Alt 27.06.2006, 13:20
Benutzerbild von heiko_rs
Erfahrener Benutzer
XHTMLforum-Kenner
 
Registriert seit: 18.09.2005
Ort: Berlin
Beiträge: 9.848
heiko_rs ist ein wunderbarer Anblickheiko_rs ist ein wunderbarer Anblickheiko_rs ist ein wunderbarer Anblickheiko_rs ist ein wunderbarer Anblickheiko_rs ist ein wunderbarer Anblickheiko_rs ist ein wunderbarer Anblickheiko_rs ist ein wunderbarer Anblick
Standard

Die einzig wahre Lösung ist die Darstellung der Links als Liste. Die Links bekommen dabei ein display: block; und der IE noch ein paar Anpassungen. Habe das alles hier aufgeschrieben: http://xhtmlforum.de/40267-css-haeuf...tml#post296439. Falls es dennoch eine Tabelle sein soll/muß, läßt sich alles auf deren Zellen übertragen.

Geändert von heiko_rs (27.06.2006 um 13:23 Uhr)
Mit Zitat antworten
Sponsored Links
  #3 (permalink)  
Alt 27.06.2006, 13:22
Benutzerbild von Gumbo
XHTMLforum-Kenner
 
Registriert seit: 22.08.2004
Ort: Trier
Beiträge: 2.733
Gumbo ist jedem bekanntGumbo ist jedem bekanntGumbo ist jedem bekanntGumbo ist jedem bekanntGumbo ist jedem bekanntGumbo ist jedem bekannt
Standard

Letztere Lösung und dazu folgendes Stylesheet:
Code:
td a {
	display: block;
}
__________________
Markus Wulftange
Mit Zitat antworten
  #4 (permalink)  
Alt 27.06.2006, 15:18
Neuer Benutzer
neuer user
Thread-Ersteller
 
Registriert seit: 05.03.2006
Beiträge: 11
phpfuchs befindet sich auf einem aufstrebenden Ast
Standard @Gumbo

@Gumbo:

Danke, beim Firefox funtioniert's, beim IE jedoch leider nicht
Mit Zitat antworten
  #5 (permalink)  
Alt 27.06.2006, 15:24
Benutzerbild von heiko_rs
Erfahrener Benutzer
XHTMLforum-Kenner
 
Registriert seit: 18.09.2005
Ort: Berlin
Beiträge: 9.848
heiko_rs ist ein wunderbarer Anblickheiko_rs ist ein wunderbarer Anblickheiko_rs ist ein wunderbarer Anblickheiko_rs ist ein wunderbarer Anblickheiko_rs ist ein wunderbarer Anblickheiko_rs ist ein wunderbarer Anblickheiko_rs ist ein wunderbarer Anblick
Standard

Wie gesagt, mein Link - inkl. IE-Anpassungen - läßt sich auch auf Tabellenzellen übertragen. td a braucht für den IE "Layout", am einfachsten in Form von min-height bzw. height: 1px; (siehe Link).

Geändert von heiko_rs (27.06.2006 um 15:30 Uhr)
Mit Zitat antworten
  #6 (permalink)  
Alt 27.06.2006, 15:42
edc edc ist offline
Neuer Benutzer
neuer user
 
Registriert seit: 12.06.2006
Beiträge: 6
edc befindet sich auf einem aufstrebenden Ast
Standard

Hallo!

Der beste Link, den ich dafür kenne ist: http://css.maxdesign.com.au/listamatic/

mfg, edc
Mit Zitat antworten
  #7 (permalink)  
Alt 27.06.2006, 15:56
Benutzerbild von heiko_rs
Erfahrener Benutzer
XHTMLforum-Kenner
 
Registriert seit: 18.09.2005
Ort: Berlin
Beiträge: 9.848
heiko_rs ist ein wunderbarer Anblickheiko_rs ist ein wunderbarer Anblickheiko_rs ist ein wunderbarer Anblickheiko_rs ist ein wunderbarer Anblickheiko_rs ist ein wunderbarer Anblickheiko_rs ist ein wunderbarer Anblickheiko_rs ist ein wunderbarer Anblick
Standard

Es geht um IE-Anpassungen, ich glaube kaum, daß man diesbzgl. dort fündig wird. Außerdem geht's dort um Listen, während es hier bei einer Tabelle bleibt.
Mit Zitat antworten
  #8 (permalink)  
Alt 27.06.2006, 19:08
Neuer Benutzer
neuer user
Thread-Ersteller
 
Registriert seit: 05.03.2006
Beiträge: 11
phpfuchs befindet sich auf einem aufstrebenden Ast
Standard

Ich hab es so gelöst, es funktioniert beim IE sowie beim Firefox:

CSS-Teil:
Code:
table.calendar {
  border:1px solid #000;
  width:560px;
}
table.calendar th {
  width:80px;
  background-color:#00ff00;
  color:#000000;
  text-align:center;
  font-family: Arial, Helvetica, sans-serif;
  font-size:10pt;
}
table.calendar td:hover {
  background-color:#ff8800;
}
table.calendar td {
  font-family: Arial, Helvetica, sans-serif;
  font-size:8pt;
  background-color:#ffff00;
  text-align:right;
  height:40px;
  vertical-align:top;
}
table.calendar td a {
  display:block;
  height:40px;
  text-decoration:none;
}
HTML-Teil:
Code:
<table class="calendar" cellspacing="1">
  <tr>
    <th>Montag</th>
    <th>Dienstag</th>
    <th>Mittwoch</th>
    <th>Donnerstag</th>
    <th>Freitag</th>
    <th>Samstag</th>
    <th>Sonntag</th>
  </tr>
  <tr>
    <td><a href="#">1.</a></td>
    <td><a href="#">2.</a></td>
    <td><a href="#">3.</a></td>
    <td><a href="#">4.</a></td>
    <td><a href="#">5.<br /><br />Sommer-Party</a></td>
    <td><a href="#">6.</a></td>
    <td><a href="#">7.</a></td>
  </tr>
  {usw...}
</table>
Allerdings funktioniert der HOVER-Effekt (beim drüberfahren mit der Maus soll sich die Hintergrundfarbe ändern) beim IE nicht. Weiß hier jemand Abhilfe?

Geändert von phpfuchs (27.06.2006 um 19:12 Uhr)
Mit Zitat antworten
  #9 (permalink)  
Alt 27.06.2006, 19:18
Erfahrener Benutzer
XHTMLforum-Kenner
 
Registriert seit: 25.03.2004
Beiträge: 1.838
RoToRa wird schon bald berühmt werden
Standard

Zitat:
Zitat von phpfuchs
Code:
table.calendar td {
  height:40px;
}
table.calendar td a {
  height:40px;
}
Eine fixe Höhe (zumindest beim Link) ist keine gute Idee, da Höhenangaben sich bei Tabellenzellen und Block-Elementen sich anderes verhalten. Wenn der Text nicht in de 40px himnein passt wird sich die Tabellenzelle vergrößern, der Link wird (in allen Browsern außer IE) aber fix bei 40px bleiben, da es sich nicht mit anpasst. Statt dessen beim Link die Höhe auf 100% setzen.

Zitat:
Allerdings funktioniert der HOVER-Effekt (beim drüberfahren mit der Maus soll sich die Hintergrundfarbe ändern) beim IE nicht. Weiß hier jemand Abhilfe?
IE unterstützt :hover nur auf Links. Also den hover mit a:hover definieren, da gehört es auch hin.

Robin
Mit Zitat antworten
Sponsored Links
  #10 (permalink)  
Alt 27.06.2006, 21:57
#
XHTMLforum-Kenner
 
Registriert seit: 30.06.2005
Ort: Hamburg
Beiträge: 2.092
IChao ist ein sehr geschätzer MenschIChao ist ein sehr geschätzer MenschIChao ist ein sehr geschätzer MenschIChao ist ein sehr geschätzer Mensch
Standard

/*blödsinn gestrichen */
__________________
Ingo Chao

Buch: Fortgeschrittene CSS-Techniken

Geändert von IChao (27.06.2006 um 22:05 Uhr)
Mit Zitat antworten
Sponsored Links
Antwort

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
100% Höhe Problem im FF und im IE mimii CSS 7 08.02.2008 17:55
Ständig wechselnde Bilder, Werbung Vybsi (X)HTML 17 25.01.2008 00:00
Fehlerfreier Code? _h4ze CSS 3 04.05.2006 22:31
Problem mit Hintergrund vom Sidebar! Pumpkin CSS 2 01.04.2006 05:14
Link markieren bei Auswahl Anonymous CSS 2 17.06.2003 15:32


Alle Zeitangaben in WEZ +2. Es ist jetzt 09:27 Uhr.