ComputerBase
Aktuelles
DXP GT – Fireplace
DXP GT – Mobile Footer Layer

CSS Bild soll direkt neben Text erscheinen

D

darton

Lt. Junior Grade
Registriert
Okt. 2004
Beiträge
282
Hallo!
Ich habe ein kleines Problem. Ich habe eine Tabelle und möchte neben den Überschriften diese kleinen Pfeile anzeigen lassen, damit ich die Tabelle anschließend anhand der Daten in dieser Spalte sortieren kann. Das habe ich nun auch versucht, aber das Pfeil-Symbol wird unter der Überschrift angezeigt. Wenn ich mit float: right; arbeite, steht das Symbol zwar rechts daneben, aber am Zellenrand und es soll eben direkt neben dem Text stehen ohne einen Zwischenraum. Ihr könnt euch die Seite hier anschauen. Wie löse ich das Problem?
 
Zuletzt bearbeitet:
Warum fügst du nicht den Pfeil direkt als Bild ein? Da es ein Objekt ist, mit dem man direkt interagiert wäre es sinnvoller, es im HTML Code einzufügen. CSS ist nur für die Darstellung, nicht die Inhaltselemente.

Wenn es normal im Code steht, ist es auch direkt neben dem Text, außer die Zelle ist zu klein. Dann musst du ein   zwischen Text und Bild machen, das sollte sogar beim jetzigen Code funktionieren.
 
Zuletzt bearbeitet:
Ja, da hast du Recht. Aber, wenn ich das in einem img-Tag mache, kann ich nicht so einfach das Bild austauschen. Wenn es in einem span drinne ist, reicht es, wenn ich nur die Klasse dazu verändere.
 
Ok, dann probiere es mal mit einem &npsp; zwischen Text und <span> und ohne float.
Ergänzung ()

Zwischen Nachnahme und &nbsp; darf auch kein Leerzeichen stehen, sonst macht ein &nbsp; wenig Sinn ;)
 
Hmm...das bewirkt leider nur, dass die Linie unter dem Link länger wird.
 
Ah, ich habe den Fehler gefunden. Du hast bei der Klasse .pfeil display:block gesetzt. Lass das weg, denn das willst du ja gerade nicht.
Ergänzung ()

Hmm, dann ist der Pfeil weg ^^
 
Richtig, dann ist der Pfeil weg ;) Das war auch der Grund, warum ich display: block; eingefügt habe.
 
Naja, das Problem ist, dass der span keinen Inhalt hat, und deswegen nur auf 0x0 Pixel Größe gerendert wird.
Ergänzung ()

Ok, Problem erkannt: Man kann einem Inline-Element keine Größe zuordnen, die wird immer aus dem Inhalt errechnet. Mögliche Lösungen:
* als display:block in neue Zeile
* als float in derselben Zeile, aber am Rand
* als display:inline, jedoch ohne Größenangabe und mit drei &nbsp;
 
Ja, das mit den drei &nbsp; habe ich jetzt auch rausgefunden. Ist zwar nicht die feine Art, aber es funktioniert wenigstens.
 
Du musst dich einloggen oder registrieren, um hier zu antworten.
Zurück
Oben

Willkommen auf ComputerBase!

Mit Werbung weiterlesen

Besuche ComputerBase wie gewohnt mit Werbung und Tracking. Die Zustimmung ist jederzeit widerrufbar.

Details im Privacy Center und in der Liste unserer Partner. Ein Widerruf ist möglich in der Datenschutzerklärung.

… oder ComputerBase Pro bestellen

Nutze ComputerBase ohne Werbebanner, Video-Ads und Werbetracking schon für 4 €/Monat oder 36 €/Jahr.

Mehr zu ComputerBase Pro

Bereits Pro-Nutzer? Hier anmelden.

Tracking: Wir und unsere 187 Partner verarbeiten personenbezogene Daten, indem wir mit auf Ihrem Gerät gespeicherten Informationen (z. B. eindeutige Kennungen in Cookies) ein Nutzungsprofil erstellen, um z. B. Anzeigen zu personalisieren. Verarbeitungszwecke: Genaue Standortdaten und Abfrage von Geräteeigenschaften zur Identifikation, Informationen auf einem Gerät speichern und/oder abrufen, Personalisierte Anzeigen und Inhalte, Anzeigen- und Inhaltsmessungen, Erkenntnisse über Zielgruppen und Produktentwicklungen.

Impressum Kontakt Datenschutz