[CSS] Text in einer Spalte links und rechtsbündig?

tobias-digital · 13. Juni 2005

Hallo!

Ich bastel momentan daran das angehängte Layout mit CSS umzusetzen.

Das Problem ist der "mehr"-Link. Ich will das der Text linksbündig steht, der "mehr"-Link jedoch rechts ausgerichtet ist. Geht das irgendwie mit CSS?

Danke und Grüße, Tobias

Aiun · 13. Juni 2005

nein.

Den Link musst du dann in ein <Div> oder so packen und dort neu ausrichten.

etreu · 14. Juni 2005

Ja, das sollte gehen.

Nimm für den Link eine extra CSS-Klasse. Dieser weist du dann float: right zu. Damit sollte das ganze dann auch schon funktionieren. Wenn nicht, dann kannst du ja mit display-Eigenschaften ein bischen rumspielen.

Wie gesagt, prinzipiell sollte es klappen.

geloescht_JesterDay · 14. Juni 2005

Nimm für den Link eine extra CSS-Klasse. Dieser weist du dann float: right zu.

Durch einen Float wird das Element aber aus dem eigentlichen Textfluss genommen, sprich die Position, die es durch den anderen Fliesstext hat hat das Element dann nicht mehr.

Ich hatte (habe) ein ähnliches Problem in einem Fussbereich. Ein Teil soll dort rechtsbündig stehen. Mit Float:right war der dann zwar rechts, aber etwas höher und hat das gesamte Layout zerschossen.

etreu · 14. Juni 2005

Mit ein paar anderen Eigenschaften geht das bestimmt zu kompensieren. Ich probier mal ein bischen was aus, wenn ich Zeit habe.

tobias-digital · 14. Juni 2005

Also ich hab jetzt wirklich sehr viel ausprobiert. und komme zu keinem akzeptablen Ergebnis. Ich habe jetzt beschlossen das "mehr" zwar rechtsbündig aber immer in eine neue Zeile zu setzen.

etreu · 19. Juni 2005

Und es geht doch:

Infos hier: http://de.selfhtml.org/css/eigenschaften/positionierung.htm#position

Beispiel hier:



<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">

<html><head>

  <meta content="text/html; charset=ISO-8859-1" http-equiv="content-type">

  <title>detail_link_rechts_ausgerichtet</title>



  <style type="text/css">

	div.paragraph {

		border: solid 1px black;

		font-family: Verdana;

		font-size: smaller;

		position: relative;

	}

	div.moreLink {

		color: navy;

		margin: 5px;

		display:inline;

		border: 1px solid red;

		position: absolute;

		right: 5px;

	}

  </style>

</head>


<body>

<div class="paragraph">

	Das hier ist ein einfacher Beispieltext. Dies ist ein Auschnitt von

	Informationen. Um weitere Informationen zu erhalten: den rechts

	stehenden Link wählen.<br>

	Das hier ist ein einfacher Beispieltext. Dies ist ein Auschnitt von

	Informationen. Um weitere Informationen zu erhalten: den rechts

	stehenden Link wählen.

	<div class="moreLink">{mehr}</div>

</div>


</body>

</html>


[/PHP]

kills · 20. Juni 2005

Hi Enrico,

das von dir gepostete Beispiel geht bei mir weder im FF (1.04) noch im IE (6.0).

OS: Win2000 SP4

Gruß,

Markus

geloescht_JesterDay · 20. Juni 2005

Der Link geht zwar bei mir, sein Beispiel konnte ich da aber nicht finden. Und auch das Beispiel selbst funktioniert nicht wie gewünscht (im IE 6, FF und Opera). Der "Link" ist zwar rechts, aber überschneidet immer den Rand oder den Text.

EDIT: da wo ich sowas bräuchte, im Fussbereich (s.o.), sieht es sogar noch viel schlimmer aus. Wobei die Idee das über die Position zu machen ansich vielleicht nicht schlecht ist, aber es wird halt total statisch dadurch und auch wenn z.B. der Betrachter eine andere Schriftgröße hat als du, geht es nicht mehr damit.

Anmelden

[CSS] Text in einer Spalte links und rechtsbündig?

Empfohlene Beiträge

Link zu diesem Kommentar

Auf anderen Seiten teilen

Link zu diesem Kommentar

Auf anderen Seiten teilen

Link zu diesem Kommentar

Auf anderen Seiten teilen

Link zu diesem Kommentar

Auf anderen Seiten teilen

Link zu diesem Kommentar

Auf anderen Seiten teilen

Link zu diesem Kommentar

Auf anderen Seiten teilen

Link zu diesem Kommentar

Auf anderen Seiten teilen

Link zu diesem Kommentar

Auf anderen Seiten teilen

Link zu diesem Kommentar

Auf anderen Seiten teilen

Dein Kommentar

Fachinformatiker Jobs

Fachinformatiker.de, 2024 by SE Internet Services

Links

Fachinformatiker.de App

Kontakt

Social media u. feeds

Jobboard für Fachinformatiker und IT-Fachkräfte