Bild ausrichten

[Matze]

Hallo,
ich versuch eine Grafik unten in einer Tabellenzelle auszurichten.
Oben drüber soll der Text nach oben ausgerichtet sein.
Der Quelltext ist:

<td width="50%" style="vertical-align:top;">
   <br />Inhalt oben<br /><br />
   <div style="vertical-align:bottom;">
       <img src="line.jpg" width="350" height="2" />
   </div>
  </td>

Das Bild wird trotzdem direkt unter dem Text
und nicht am unteren Ende der Zelle angezeigt.
Kann mir jemand sagen wie ich das hin krieg?
Danke schön!
Grüße, Matze

[Color]

Hallo,
ich versuch eine Grafik unten in einer Tabellenzelle auszurichten.
Oben drüber soll der Text nach oben ausgerichtet sein.
Der Quelltext ist:

<td width="50%" style="vertical-align:top;">
   <br />Inhalt oben<br /><br />
   <div style="vertical-align:bottom;">
       <img src="line.jpg" width="350" height="2" />
   </div>
  </td>

Das Bild wird trotzdem direkt unter dem Text
und nicht am unteren Ende der Zelle angezeigt.
Kann mir jemand sagen wie ich das hin krieg?
Danke schön!
Grüße, Matze

Versuchmal so

<td width="50%" hight="50" style="vertical-align:top;">

ansonsten würd ich noch ein <TD hight="20"></TD> einfügen

[Matze]

Hallo Color,
ich kann leider nicht mit height arbeiten weil der
Inhalt der Zelle dynamisch eingefügt wird.
Eine neue Zeile wär eine Idee, das wollte ich aber
eigentlich vermeiden.
Und das wäre <tr> nicht <td> oder hab ich dich
jetzt falsch verstanden?
Eine neue Spalte bringt mir ja nichts wenn das
Bild drunter und nicht daneben soll.
Grüße, Matze

[Color]

Hallo Color,
ich kann leider nicht mit height arbeiten weil der
Inhalt der Zelle dynamisch eingefügt wird.
Eine neue Zeile wär eine Idee, das wollte ich aber
eigentlich vermeiden.
Und das wäre <tr> nicht <td> oder hab ich dich
jetzt falsch verstanden?
Eine neue Spalte bringt mir ja nichts wenn das
Bild drunter und nicht daneben soll.
Grüße, Matze

Hallo Matze hast recht meinte <tr> einfügen ich wüste sonst auch keine möglichkeit auser filleicht noch mit "align top" methode oder ein dem hintegrund farblich angepassten bild einfügen,empfehle auch auf <table border> zu stellen damit hat mann besseren überblick.

[color]

<td width="50%" style="vertical-align:top;">
   <br />Inhalt oben<br /><br />
   <div style="vertical-align:bottom;">
       <img src="line.jpg" width="350" height="2" />
   </div>
  </td>

<br></br> Nicht <br/><br/>

[Matze]

<br></br> Nicht <br/><br/>

Niemals </br> BR ist ein Zeilenumbruch und wird nicht abgeschlossen.
<br /> ist schon richtig. XHTML ! Lies dir mal den Abschnitt durch!
Grüße, Matze

[Længlich]

Merhaba!

<br></br> Nicht <br/><br/>

Niemals </br> BR ist ein Zeilenumbruch und wird nicht abgeschlossen.
<br /> ist schon richtig. XHTML ! Lies dir mal den Abschnitt durch!

Syntaktisch ist beides richtig, denn in XHTML muß jedes Tag wieder geschlossen werden, und <br /> ist eine Kurzschreibweise für <br></br>.

Allerdings bedeuten Eure beiden Varianten was Unterschiedliches: <br></br> ist nur ein Zeilenumbruch, <br /><br /> dagegen sind zwei.

Viele Grüße vom Længlich

[Matze]

Danke, das hab ich nach nochmaligem Lesen bemerkt.
Hilft mir beim Problem aber wenig weiter.
Grüße, Matze

[Længlich]

Salut!

Danke, das hab ich nach nochmaligem Lesen bemerkt.
Hilft mir beim Problem aber wenig weiter.

Ja, klar - ich wollte es nur erwähnt haben.
Was Dein Problem betrifft: Es geht doch um die dunkelbraunen Striche nach jeder Texteinheit, oder? Die sollen bei zwei nebeneinander stehenden Textabschnitten auf gleicher Höhe sein, richtig?

Wie wäre es, wenn Du dafür gar keine Bilder, sondern die untere Rahmenlinie der Tabellenzellen verwenden würdest? Also für alle Tabellenzellen:
border-bottom:2px solid #53440b;
Dann stimmt natürlich die Breite nicht mehr, die mußt Du den Tabellenzellen geben. Jetzt fehlt nur noch der Abstand zwischen den beiden Linien, die nebeneinander liegen (sprich: zwischen den Zellen), und den kannst Du mit margin realisieren.

Viele Grüße vom Længlich

[MudGuard]

Hi,

Dann stimmt natürlich die Breite nicht mehr, die mußt Du den Tabellenzellen geben. Jetzt fehlt nur noch der Abstand zwischen den beiden Linien, die nebeneinander liegen (sprich: zwischen den Zellen), und den kannst Du mit margin realisieren.

Nö, natürlich nicht. Denn Tabellenzellen haben keinen margin.

border-spacing käme evtl in Frage ...

cu,
Andreas

[Matze]

Das ist eine gar so üble Idee nicht.
Mir wär zwar lieber das liesse sich irgendwie
realisieren aber wenns gar nicht anders geht.
Dank und Gruß, Matze

[Matze]

Wo mir einfällt dass das mit dem unteren Rahmen
nur bedingt Sinn hat, weil der Preis auch unten stehen soll ;-)

Grüße, Matze

[wahsaga]

hi,

ich versuch eine Grafik unten in einer Tabellenzelle auszurichten.
Oben drüber soll der Text nach oben ausgerichtet sein.
Der Quelltext ist:

<td width="50%" style="vertical-align:top;">
   <br />Inhalt oben<br /><br />
   <div style="vertical-align:bottom;">
       <img src="line.jpg" width="350" height="2" />
   </div>
  </td>

Das Bild wird trotzdem direkt unter dem Text
und nicht am unteren Ende der Zelle angezeigt.

Natürlich nicht.
vertical-align hätte eine Wirkung, wenn du es auf ein Tabellenelement - beispielsweise die Tabellenzelle anwendest. Aber dann beträfe es auch wieder ihren gesamten Inhalt.

Kann mir jemand sagen wie ich das hin krieg?

Positioniere das Bild absolute am bottom der Tabellenzelle.
Den Div um das Bild kannst du dir höchstvermutlich sparen - dafür solltest du um den kompletten Inhalt der Zelle eines legen, denn die Auswirkungen von position:relative für eine Tabellenzelle sind undefiniert.

gruß,
wahsaga

[Matze]

Also soll ich so tun:

<td width="50%" style="vertical-align:top;">
    <div>
       <br />Inhalt oben<br />
       <img src="line.jpg" width="350" height="2" style="position:relative; vertical-align:bottom;"/>
    </div>
   </td>

Geht aber leider trotzdem nicht.
Grüße, Matze

[Matze]

Vielleicht sollte ich noch erwähnen das ich Firefox benutze.
Der IE und Firefox unterscheiden sich in Sachen CSS ja mitunter
gewaltig.

[wahsaga]

hi,

Also soll ich so tun:

Nein.

<img src="line.jpg" width="350" height="2" style="position:relative; vertical-align:bottom;"/>

Ich sprach nicht davon, das Bild selber relativ zu positionieren.
Dass das hier wenig sinnvoll ist, weil es sich auf die Normalposition des Bildes bezieht, sollte klar sein.

Geht aber leider trotzdem nicht.

Moment, was willst du überhaupt erreichen?
Deine TD hat keine Höhe mitbekommen - also willst du gar nicht ein Bild unten in einer TD positionieren, die höher ist als es ihr Inhalt erfordert?
Geht es dir nur darum, unter einem Bild, welches als letzter Inhalt der TD steht, keinen Freiraum mehr zu haben?
Dann ziehe ich den Vorschlag mit der absoluten Positionierung augenblicklich zurück, und schlage vor, dass du dich bzgl. des "Unterlängen-Problems" informierst.

gruß,
wahsaga

[Matze]

Wie gesagt kann ich keine Höhe angeben weil die sich ja je nach Inhalt (dynamisch) ändert.

Geht es dir nur darum, unter einem Bild, welches als letzter Inhalt
der TD steht, keinen Freiraum mehr zu haben?

GENAU!!

Dann ziehe ich den Vorschlag mit der absoluten Positionierung
augenblicklich zurück, und schlage vor, dass du dich bzgl. des
"Unterlängen-Problems" informierst.

Das tu ich die ganze Zeit dachte ich?!?!

Guck du hier, dann siehst du was ich meine:

http://www.m-schleifzentrum.de/preise.php

Grüße, Matze

[wahsaga]

hi,

Dann ziehe ich den Vorschlag mit der absoluten Positionierung
augenblicklich zurück, und schlage vor, dass du dich bzgl. des
"Unterlängen-Problems" informierst.

Das tu ich die ganze Zeit dachte ich?!?!

Wenn du das getan hast - wo ist dann noch das Problem?

gruß,
wahsaga

[Matze]

Was genau meinst du mit "Unterlängen-Problem"?
Ich hab hier mal ein bisschen gesucht und gegoogelt
aber nix dazu gefunden.
Grüße, Matze

[Matze]

Moment mal, Sorry!!

Deine TD hat keine Höhe mitbekommen - also willst du gar nicht ein Bild unten in einer TD positionieren, die höher ist als es ihr Inhalt erfordert?

Doch!

Geht es dir nur darum, unter einem Bild, welches als letzter Inhalt der TD steht, keinen Freiraum mehr zu haben?

Auch, aber das ist nicht das Problem sofern ich das erste gelöst habe
denke ich.

Grüße, Matze