zurück zur Startseite
  


Zurück XHTMLforum > (X)HTML und CSS > CSS
Seite neu laden Menü - aktuelle Seite - Formatierung

Antwort
 
LinkBack Themen-Optionen Ansicht
  #1 (permalink)  
Alt 31.07.2015, 16:22
Neuer Benutzer
neuer user
Thread-Ersteller
 
Registriert seit: 31.07.2015
Beiträge: 5
Koenigsspringer befindet sich auf einem aufstrebenden Ast
Standard Menü - aktuelle Seite - Formatierung

Hallo,

ich habe mir schon die Finger wundgegoogelt und komme einfach nicht weiter. Vielleicht könnt ihr mir ja helfen:

Ich möchte ein Menü, das mir die jeweils aktuelle Seite farblich hervorgehoben anzeigt. Das klappt auch, aber ich schaffe es nicht, die anderen Seiten entsprechend darzustellen. Das Menü ist als Tabelle aufgebaut, was auch so bleiben muss. Die Formatierung der Zellen funktioniert, aber alles, was mit Text zu tun hat, wird ignoriert. Kein Zentrieren, keine Textfarbe, kein Garnix.

Die CSS-Datei:
#navigation { display:block; margin-left: auto; margin-right: auto; text-align: center; background-color: #aafdab;
color: black; border-style:ridge; border-width:0px; padding:0px; text-decoration: none;}
#seite1 #navigation a.seite1,
#seite2 #navigation a.seite2,
#seite3 #navigation a.seite3,
#seite4 #navigation a.seite4,
#seite5 #navigation a.seite5,
#seite6 #navigation a.seite6 {display:block; text-align:center; background-color: #0f8902; color: black; font-weight: bold; font-size: 22px;}


und die Tabelle für das Menü:
<body id="seite1">
<div id="navigation">
<table width="100%" border="0" cellspacing="0" cellpadding="0">
<tr>
<td width="5%" bgcolor="white"> </td>
<td width="90%">
<table width="100%" border="0" cellspacing="0" cellpadding="0">
<tr>
<td width="16.6%"><a class="seite1" href="seite1.html">Seite 1</a></td>
<td width="16.6%"><a class="seite2" href="seite2.html">Seite 2</a></td>
<td width="16.6%"><a class="seite3" href="seite3.html">Seite 3</a></td>
<td width="16.6%"><a class="seite4" href="seite4.html">Seite 4</a></td>
<td width="16.6%"><a class="seite5" href="seite5.html">Seite 5</a></td>
<td width="16.6%"><a class="seite6" href="seite6.html">Seite 6</a></td></td>
</tr>
</table>
</td>
<td width="5%" bgcolor="white"></td>
</tr>

</table>
</div>
</body>

Ich bin mit meinem Latein (genauer mit meinem CSS) am Ende.

Viele Grüße und Danke
Mit Zitat antworten
Sponsored Links
  #2 (permalink)  
Alt 31.07.2015, 18:16
Erfahrener Benutzer
XHTMLforum-Kenner
 
Registriert seit: 10.01.2010
Beiträge: 1.123
MrMurphy ist ein sehr geschätzer MenschMrMurphy ist ein sehr geschätzer MenschMrMurphy ist ein sehr geschätzer Mensch
Standard

Hallo,

bei mir funktionierts.

Gruss

MrMurphy
Mit Zitat antworten
Sponsored Links
  #3 (permalink)  
Alt 31.07.2015, 18:31
Neuer Benutzer
neuer user
Thread-Ersteller
 
Registriert seit: 31.07.2015
Beiträge: 5
Koenigsspringer befindet sich auf einem aufstrebenden Ast
Standard

Hallo,

das ist seltsam. Die Texte, also Seite 1, Seite 2 etc. sind in allen Zellen zentriert, nicht nur in der jeweils aktuellen dunkelgrün unterlegten Zelle?

Viele Grüße
Mit Zitat antworten
  #4 (permalink)  
Alt 31.07.2015, 18:57
Erfahrener Benutzer
XHTMLforum-Kenner
 
Registriert seit: 10.01.2010
Beiträge: 1.123
MrMurphy ist ein sehr geschätzer MenschMrMurphy ist ein sehr geschätzer MenschMrMurphy ist ein sehr geschätzer Mensch
Standard

Hallo

Ja. Obwohl der Quelltext eher Schrott ist und Validator rotiert.

Gruss

MrMurphy

Geändert von MrMurphy (31.07.2015 um 19:06 Uhr)
Mit Zitat antworten
  #5 (permalink)  
Alt 31.07.2015, 19:53
Neuer Benutzer
neuer user
Thread-Ersteller
 
Registriert seit: 31.07.2015
Beiträge: 5
Koenigsspringer befindet sich auf einem aufstrebenden Ast
Standard

Ich hatte den Doctype vergessen, da hast du mich auf die richtige Spur gebracht. Die CSS-Datei habe ich auch etwas aufgeräumt. Zentrieren funktioniert jetzt in allen Zellen, aber ich bekomme das Unterstreichen der Hyperlinks und die blaue Linkfarbe nicht raus. Das sollte doch mit text-decoration: none funktionieren ...

Hier die aktuelle CSS-Datei:
#navigation {display:block; text-align:center; background-color: #aafdab; color: black; font-weight: bold; font-size: 22px; text-decoration: none;}

#seite1 #navigation a.seite1,
#seite2 #navigation a.seite2,
#seite3 #navigation a.seite3,
#seite4 #navigation a.seite4,
#seite5 #navigation a.seite5,
#seite6 #navigation a.seite6 {display:block; text-align:center; background-color: #0f8902; color: white; font-weight: bold; font-size: 22px;}

und das eigentliche Menü:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="de" lang="de">

<head>
<link href="screen.css" rel="stylesheet" type="text/css" media="all">
</head>

<body id="seite1">
<div id="navigation">
<table width="100%" border="0" cellspacing="0" cellpadding="0">
<tr>
<td width="5%" bgcolor="white"> </td>
<td width="90%">
<table width="100%" border="0" cellspacing="0" cellpadding="0">
<tr>
<td width="16.6%"><a class="seite1" href="seite1.html">Seite 1</a></td>
<td width="16.6%"><a class="seite2" href="seite2.html">Seite 2</a></td>
<td width="16.6%"><a class="seite3" href="seite3.html">Seite 3</a></td>
<td width="16.6%"><a class="seite4" href="seite4.html">Seite 4</a></td>
<td width="16.6%"><a class="seite5" href="seite5.html">Seite 5</a></td>
<td width="16.6%"><a class="seite6" href="seite6.html">Seite 6</a></td></td>
</tr>
</table>
</td>
<td width="5%" bgcolor="white"></td>
</tr>
</table>
</div>
</body>

Danke erstmal bis hierhin
Mit Zitat antworten
  #6 (permalink)  
Alt 03.08.2015, 09:12
Erfahrener Benutzer
XHTMLforum-Kenner
 
Registriert seit: 30.01.2014
Beiträge: 2.247
cloned ist ein wunderbarer Anblickcloned ist ein wunderbarer Anblickcloned ist ein wunderbarer Anblickcloned ist ein wunderbarer Anblickcloned ist ein wunderbarer Anblickcloned ist ein wunderbarer Anblickcloned ist ein wunderbarer Anblick
Standard

Falls du dich dazu durchringen kannst, ein semantisch sinnvolles Menü zu erstellen, orientiere dich an tutorials wie diesem. Eine Tabelle ist kein Menü und sollte deshalb auch nicht dafür verwendet werden
Mit Zitat antworten
  #7 (permalink)  
Alt 03.08.2015, 15:39
Erfahrener Benutzer
XHTMLforum-Mitglied
 
Registriert seit: 02.01.2012
Beiträge: 487
dazzle89 wird schon bald berühmt werden
Standard

Ich versteh nicht mal ganz was du willst.

Soll der Text an den linken Rand der Box rutschen, damit er genau unter der Überschrift ist?

Allerdings befindet sich die keine Überschrift in deinem Code...
Mit Zitat antworten
  #8 (permalink)  
Alt 03.08.2015, 18:25
Neuer Benutzer
neuer user
Thread-Ersteller
 
Registriert seit: 31.07.2015
Beiträge: 5
Koenigsspringer befindet sich auf einem aufstrebenden Ast
Standard

Zitat:
Zitat von dazzle89 Beitrag anzeigen
Ich versteh nicht mal ganz was du willst.

Soll der Text an den linken Rand der Box rutschen, damit er genau unter der Überschrift ist?
Hallo,

nein, der Text in den einzelnen Zellen der Tabelle sollte zentriert sein, aber er nahm keine Formatierung an. Die Links sahen aus wie die Windows-Standard-Links: blau, unterstrichen und klebten am linken Rand der Zelle. Inzwischen klappt es aber. Zwar immer noch als Tabelle, aber die CSS-Datei habe ich komplett umgestrickt:

a.menu { display:block; text-align:center; width: auto; padding:10px; text-decoration: none;}
a.menu:link { color:black; font-size: 16px; font-weight: bold; background-color:#aafdab; }
a.menu:visited { color:black; font-size: 16px; font-weight: bold; background-color:#aafdab; }
a.menu:hover { color:black; font-size: 16px; font-weight: bold; background-color:#0f8902; }
a.menu.current { color:black; font-size: 16px; font-weight: bold; background-color:#0f8902; color: white;}

Die Klasse "menu.current" wandert dann auf den einzelnen Seiten durchs Menü nach unten. Keine Ahnung, ob das regelkonform ist, aber mir gefällt die Lösung (Ja, das Menü als Tabelle zu erstellen, ist veraltet, ich weiß.)

<table width="100%" border="0" cellspacing="0" cellpadding="0">
<tr>
<td width="16.6%"><a class="menu current" href="seite1.html">Seite1</a></td>
<td width="16.6%"><a class="menu" href="seite2.html">Seite 2</a></td>
<td width="16.6%"><a class="menu" href="seite3.html">Seite 3</a></td>
<td width="16.6%"><a class="menu" href="seite4.html">Seite 4</a></td>
<td width="16.6%"><a class="menu" href="seite5">Seite 5</a></td>
<td width="16.6%"><a class="menu" href="seite6.html">Seite 6</a></td></td>
</tr>
</table>


Danke für eure Hilfe.

Geändert von Koenigsspringer (03.08.2015 um 18:28 Uhr)
Mit Zitat antworten
  #9 (permalink)  
Alt 04.08.2015, 09:23
Erfahrener Benutzer
XHTMLforum-Kenner
 
Registriert seit: 30.01.2014
Beiträge: 2.247
cloned ist ein wunderbarer Anblickcloned ist ein wunderbarer Anblickcloned ist ein wunderbarer Anblickcloned ist ein wunderbarer Anblickcloned ist ein wunderbarer Anblickcloned ist ein wunderbarer Anblickcloned ist ein wunderbarer Anblick
Standard

Wieso machst du es dann als Tabelle? Es ist nicht nur veraltet, es ist auch noch dazu falsch. Falls du in Suchmaschinen gut gefunden werden willst solltest du es ohne Tabellen umsetzen
Mit Zitat antworten
Sponsored Links
  #10 (permalink)  
Alt 04.08.2015, 12:27
Neuer Benutzer
neuer user
Thread-Ersteller
 
Registriert seit: 31.07.2015
Beiträge: 5
Koenigsspringer befindet sich auf einem aufstrebenden Ast
Standard

Zitat:
Zitat von cloned Beitrag anzeigen
Wieso machst du es dann als Tabelle? Es ist nicht nur veraltet, es ist auch noch dazu falsch. Falls du in Suchmaschinen gut gefunden werden willst solltest du es ohne Tabellen umsetzen
Hallo,

ich weiß, das klingt jetzt ein wenig schräg, aber ich möchte über Suchmaschinen nicht gefunden werden. Also, es schadet natürlich nicht, und ich wehre mich nicht dagegen, bei Google ganz oben gelistet zu werden, aber das ist nicht mein primäres Ziel.

Ich dachte mir, ich versuche es mal mit Inhalt.

Nicht, dass das der Grund für meine Tabellenentscheidung gewesen wäre, aber es ist auch kein Grund, auf ein CSS-Menü umzusteigen. Obwohl es grundsätzlich sinnvoll wäre, falls die Optik mal mit wenigen Mausklicks komplett umgestrickt werden soll, das gebe ich ja zu.

Viele Grüße
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
FAQ -- Häufig gestellte Fragen und häufig gegebene Antworten mazzo CSS 10 05.04.2012 18:32
Auf jeder seite individuelle Hintergründe im Menü ... max_pla3 CSS 8 09.12.2011 12:10
Link in Zelle andere Formatierung als bei restlicher Seite css_rulez CSS 4 16.11.2008 20:27
Problem mit Menü... Zero-X CSS 18 12.07.2006 18:52
Menü in Seite einbinden Anonymous CSS 2 21.07.2003 12:13


Alle Zeitangaben in WEZ +2. Es ist jetzt 16:58 Uhr.