[css] Viele Links nebeneinander
lima-city → Forum → Die eigene Homepage → HTML, CSS & Javascript
button
code
dank
glauben
hintergrundbild
http
image
layout
links ausrichten
list
liste
navigation
probieren
reihe
tabelle
tag
text
type
vorteil
weben
-
Hallo,
ich habe links, die ich über css mit einem Hintergrundlid versehe, ich möchte nun , dass alle Links in einer Zeile stehen.
Momentan sind alle untereinander:
Css.button { background-image:url(\'images/button.png\'); line-height:30px; font-weight: normal; display:block; width:130px; height:30px; margin:2px 2px 2px 2px; text-align:center; min-width:130px; color:#000000; text-decoration:none; }
HTML [code]<div style=\"border: #BEBEBE 1px solid; margin-top:5px;\">
<a href=\"index.php\" class=\"tag/button">button\">Startseite</a>
<a href=\"wohnung.php\" class=\"button\">Wohnung</a>
<a href=\"geld.php\" class=\"button\">Geld</a>
<a href=\"rechnungen.php\" class=\"button\">Rechnungen</a>
<a href=\"einkaufen.php\" class=\"button\">Einkaufen gehen</a>
<a href=\"logout.php\" class=\"button\">Abmelden</a>
<a href=\"../forum/\" target=\"_blank\" class=\"button\">Forum</a>
</div> -
Diskutiere mit und stelle Fragen: Jetzt kostenlos anmelden!
lima-city: Gratis werbefreier Webspace für deine eigene Homepage
-
entferne mal das display:block!
Denn im Normalfall (ohne CSS) wären die Links eh alle in einer Reihe.
lg
Vali -
Danke, zwar sind die jetzt in einer Reihe, aber das Hintergrundbild wird nicht richtig angezeigt.
Es ist nurnoch so groß, wie der Linktext, nicht wie die angegebene Größe -
Ich glaube du musst die div genauso groß machen wie das hintergrundbild sein soll
-
Ich habe an das Div, in dem die Links drin sind, im style tag width: 100% rangeschrieben, aber es hat nichts gebracht
-
versuch mal die navigation als liste anzulegen die du dann noch ordentlich mit css formatierst..... ich glaube anderst gehts nich
oder du arbeitest mit float:left; ...aber da kannst de dann nichts mehr mit positionierung machen
Beitrag geändert: 5.7.2008 13:08:09 von mageins -
Meinst du mit liste den UL und LI-Tag?
Ich wüsste jetzt aber nicht, wie ich die in eine Reihe bekomme.
Und untereinander geht auf Paltzgründen nicht. -
Meinst du mit liste den UL und LI-Tag?
Ich wüsste jetzt aber nicht, wie ich die in eine Reihe bekomme.
Und untereinander geht auf Paltzgründen nicht.
na du legst ne liste an und sagst ihr wie gross das jeweilige feld is.... und die kann man auch mit float left nebeneinander erscheinen lassen..
ich kann mal nen beispiel schicken.... -
<ul id=\"navigation\">
<li id=\"aktu\"><p align=\"center\">startseite</li></p>
<li><p align=\"center\"><a class=\"zwei\" href=\"kontakt.html\">kontakt</a></li></p>
</ul>
<ul id=\"navigation\">
<li> ......
und die css:
li {
list-style-type: none;
margin-top:0;
height: 16px;
}
ul {
float:left;
}
ul#navigation{
list-style-type:none;
margin-left:0;
margin-top:3px;
width: 100px;
padding: 0; -
hmm, bei mir werden die Listenpunkte trotz css immernoch untereinander angezeigt.
-
<!-- xHTML --> <ul id=\"nav\"> <li><a href=\"#\">Lorem</a></li> <li><a href=\"#\">Ipsum</a></li> <li><a href=\"#\">dolor</a></li> </ul>
/* CSS */ #nav { overflow: hidden; /* Automatisch floaten */ } #nav li { float: left; /* links ausrichten */ } #nav li a { background: url(\'navlia.png\'); /* muss angepasst werden */ float: left; /* links ausrichten */ /*width: ;*/ /* auskommentieren, wenn nötig */ /*height: ;*/ /* auskommentieren, wenn nötig */ /*line-height: ;*/ /* auskommentieren, wenn nötig */ /* Vertikale Zentrierung - muss mit height übereinstimmen */ padding: 3px 5px; /* Innenabstände */ margin-right: 10px; /* rechter Außenabstand */ } -
hujiko schrieb:
Danke, ich werde es nun so probieren, und wenn es nicht geht, dann auf Tabellen umsteigen.
Ts, ts, ts; ein bisschen mehr Motivation, bitte! ;) Die Welt ist nicht perfekt und CSS keine perfekte Technologie.
1. Trennung von Layout und Inhalt
2. Flexiblität, Benutzer können zwischen Stylesheets auswählen.
3. Es lassen sich schnell alternative Stylesheets für Kleincomputer und andere mobile Endgeräte entwickeln
4. Mehr Barrierefreiheit
5. Weniger Traffic, Entlastung der Server
6. Geringere Ladezeit, Seite wird schneller gerendert
7. Tabellen sollen nicht als Gestaltungsmittel zweckentfremdet werden
8. Optimierung für die Suchmaschine möglich
9. Langfristiger Trend
— Vorteile von CSS (http://www.antikoerperchen.de/howto/75/css-contra-tabellen-layout-vorteile-und-nachteile-von-div-und-table.html)
> Manche behaupten, ich hätte das Web ruiniert,
> und für sie stimmt das auch. [...] Ich habe das
> Web ruiniert, indem ich Schokolade mit
> Erdnussbutter untrennbar vermischt habe. Ich
> bin des Verbrechens schuldig, Struktur mit Präsentation
> vermischt zu haben, und darauf steht der Galgen.
>
> — David Siegel (http://xml.com/pub/a/w3j/s1.people.html)
Ryan
-
:( :( :( :( :( :( :( :( :( :( :(
Es tut mir ja soooooo leid
Ich nin ein soo böser Mensch, ich lagere mein CSS nicht in externe Dateien aus, ich benutze keine Templates, für Admin-Bereiche und seiten, die keiner sieht nehme ich immernoch Tabellen-Layouts. Oh gott wie bin ich böse.
ABER: Ich trenne immer fein Daten von Code :)
SQL RULEZZ
Zurück zum Thema:
Ja, es hat endlich funktioniert, ABER: es werden immernoch diese doofen Aufzählungspunkte angezeigt.
EDIT => Danke, ein list-style: none; im CSS-Teil von li hat das Problem behoben
Beitrag geändert: 6.7.2008 9:27:08 von hujiko -
Diskutiere mit und stelle Fragen: Jetzt kostenlos anmelden!
lima-city: Gratis werbefreier Webspace für deine eigene Homepage
