mediengestalter.info
FAQ :: Mitgliederliste :: MGi Team

Willkommen auf dem Portal für Mediengestalter

Aktuelles Datum und Uhrzeit: Fr 19.04.2024 11:20 Benutzername: Passwort: Auto-Login

Thema: text innerhalb eines divs rutscht runter vom 18.12.2009


Neues Thema eröffnen   Neue Antwort erstellen MGi Foren-Übersicht -> Allgemeines - Nonprint -> text innerhalb eines divs rutscht runter
Seite: 1, 2  Weiter
Autor Nachricht
kras
Threadersteller

Dabei seit: 05.06.2008
Ort: Krefeld
Alter: 48
Geschlecht: Männlich
Verfasst Fr 18.12.2009 00:41
Titel

text innerhalb eines divs rutscht runter

Antworten mit Zitat Zum Seitenanfang

hallo zusammen,

habe mich jetzt doof gegoogelt und in allen möglichen foren gesucht, aber keine lösung zu meinem problem gefunden...
ich bin noch am aufbau der seite, daher findet sich das css im moment auch noch komplett in der index.html.

wenn ihr hier schaut, seht ihr das problem 1px-schwarz-gerahmt.
die bilder habe ich einfach mit padding runtergeschoben, damit die eine höhe mit dem text haben. so sollte die ausrichtung von text und bild aneinander sein, allerdings am top des divs. so ist es jedenfalls murks, aber ich finde meinen fehler nicht...

wäre äußerst dankbar für einen sinnvollen tipp!

1000 dank im voraus!

kras
  View user's profile Private Nachricht senden
Kash

Dabei seit: 07.11.2002
Ort: Schopfheim
Alter: 41
Geschlecht: Männlich
Verfasst Fr 18.12.2009 10:24
Titel

Antworten mit Zitat Zum Seitenanfang

Ich verstehe leider nur Bahnhof.

Was willst Du erreichen?
  View user's profile Private Nachricht senden
Anzeige
Anzeige
buchstabensuppe

Dabei seit: 14.09.2004
Ort: Wuppertal
Alter: 40
Geschlecht: Männlich
Verfasst Fr 18.12.2009 10:51
Titel

Antworten mit Zitat Zum Seitenanfang

Möchtest du, dass der Text auf der linken Seite bündig neben den jeweiligen Bild steht?

Falls die Bilder immer die gleiche Größe haben könntest du einfach einen Container mit dem Text erstellen. Diesem gibtst du dann das Bild als Hintergrundgrafik, positionierst diese oben links und passt den Text durch padding an.
  View user's profile Private Nachricht senden
heiko_rs

Dabei seit: 06.02.2008
Ort: Berlin
Alter: -
Geschlecht: Männlich
Verfasst Fr 18.12.2009 11:18
Titel

Re: text innerhalb eines divs rutscht runter

Antworten mit Zitat Zum Seitenanfang

kras hat geschrieben:
ich finde meinen fehler nicht

Dein Fehler sind die immer noch vorhandenen vert. default-margins von p. Das Stichwort "Universalselektor" fiel zuletzt recht häufig *zwinker*

Übrigens braucht img kein umgebendes div, um links zu floaten. Auch der Text braucht kein umgebendes div. Wirf die divs .pic und .text raus, floate img links und gib p z.B. margin: 0 0 0 100px;.

buchstabensuppe, ob man img oder eine BG-Grafik verwenden sollte, richtet sich nicht nach dem Gestaltungswunsch, sondern nach der Bedeutung des Bildes: Inhaltlich relevant (z.B. das Portraitfoto eines Team-Mitgliedes) heißt img, Deko (z.B. sein "Waldfoto" unter dem Logo) heißt CSS. Was in diesem Falle angebracht ist, kann man allerdings anhand seiner wahrscheinlich provisorischen Fotos noch nicht erkennen.


Zuletzt bearbeitet von heiko_rs am Fr 18.12.2009 11:19, insgesamt 1-mal bearbeitet
  View user's profile Private Nachricht senden
kras
Threadersteller

Dabei seit: 05.06.2008
Ort: Krefeld
Alter: 48
Geschlecht: Männlich
Verfasst Fr 18.12.2009 11:37
Titel

Antworten mit Zitat Zum Seitenanfang

hallo Ihr 3!

@buchstabensuppe & Kash:
ich will erreichen, dass der text, der rechts neben dem bild steht, nicht am bottom, sondern am top des divs ausgerichtet ist, damit er obenbündig mit dem bild ist.

@heiko_rs:
das ich kein umgebendes div zum floaten brauche ist mir soweit klar. jedoch will ich, dass das der text nicht, sobald er über bildlänge läuft, in der nächsten zeile linksbündig unter dem bild weitergeht sondern immer die flucht beibehält. deshlab tut es floaten einfach so nicht...
in .pic und in .text sind doch gar keine margins angegeben?
was heißt default-margins? sind die mit den paragraph-tags vordefiniert?

danke für eure bemühungen!
kras
  View user's profile Private Nachricht senden
Kash

Dabei seit: 07.11.2002
Ort: Schopfheim
Alter: 41
Geschlecht: Männlich
Verfasst Fr 18.12.2009 11:40
Titel

Antworten mit Zitat Zum Seitenanfang

p hat irgendwo ein Padding.
Das solltest du bei der Klasse 'head' entfernen.
  View user's profile Private Nachricht senden
heiko_rs

Dabei seit: 06.02.2008
Ort: Berlin
Alter: -
Geschlecht: Männlich
Verfasst Fr 18.12.2009 11:44
Titel

Antworten mit Zitat Zum Seitenanfang

kras hat geschrieben:
dass der text, der rechts neben dem bild steht, nicht am bottom, sondern am top des divs ausgerichtet ist, damit er obenbündig mit dem bild ist.

So hatte ich das auch verstanden. Aber er wird eben runtergeschoben durch den default-margin von p.

kras hat geschrieben:
jedoch will ich, dass das der text nicht, sobald er über bildlänge läuft, in der nächsten zeile linksbündig unter dem bild weitergeht sondern immer die flucht beibehält.

Schon klar, daher schlug ich für p einen linken margin von 100px vor.

kras hat geschrieben:
in .pic und in .text sind doch gar keine margins angegeben?

Aber p hat welche.

kras hat geschrieben:
was heißt default-margins? sind die mit den paragraph-tags vordefiniert?

Genau. Sonst würde doch bei der Darstellung ohne CSS alles aneinander kleben.

Setze einfach mal meinen Vorschlag um, dann wirst Du sehen, dass es geht.
  View user's profile Private Nachricht senden
kras
Threadersteller

Dabei seit: 05.06.2008
Ort: Krefeld
Alter: 48
Geschlecht: Männlich
Verfasst Fr 18.12.2009 11:46
Titel

Antworten mit Zitat Zum Seitenanfang

sauber!

habe jetzt das bild tatsächlich als hintergrundgrafik gesetzt, den text mich div-padding nach rechts und mit p-margin nach oben gezwungen...

ich hatte schon gedacht, ich müsste komplet wahnsinnig werden!

danke vielmals!!!

lg
kras
  View user's profile Private Nachricht senden
 
Ähnliche Themen [HTML/CSS] Probleme mit IE6, Text rutscht weg
Breite/Höhe & absolute Position eines DIVs mit Text ermi
Div rutscht in anderen Div
Little Snitch wie bekomme ich den wieder runter?
website - besucherzahlen, wer lädt was runter usw...
Browserfenster/microsite runter fahren lassen
Neues Thema eröffnen   Neue Antwort erstellen Seite: 1, 2  Weiter
MGi Foren-Übersicht -> Allgemeines - Nonprint


Du kannst keine Beiträge in dieses Forum schreiben.
Du kannst auf Beiträge in diesem Forum nicht antworten.
Du kannst an Umfragen in diesem Forum nicht mitmachen.