Antworten auf deine Fragen:
Neues Thema erstellen

Antworten zum Thema „<div> mit CSS in einem Table verschachteln“

JPS

Nicht mehr ganz neu hier

Hallo,
stehe gerade auf dem Schlauch.
Ich will in einem table <td> zwei divs so positionieren wie auf dem Bild


Uploaded with

Wobei das beide divs unten zentriert sein sollen und das Schrift DIV das andere überlagern soll mit - sagen wir mal - 10px abstand zum unteren Rand des <td>. Muss da noch ein DIV um die beiden anderen drumherum?
Hat jemand einen Ansatz.
Danke im voraus
 

JPS

Nicht mehr ganz neu hier

AW: <div> mit CSS in einem Table verschachteln

Ja leider.... im unteren Teil gibt es DB Ausgaben in Spalten und Reihen usw.
Deswegen war ja meine Idee evtl um beide divs ein weiteres drumherum zu packen????
 

fexx

Aktives Mitglied

AW: <div> mit CSS in einem Table verschachteln

zu deinen divs ... du könntest es so machen

Code:
<div class="bild">
<img src="" alt="" />
<span class="beschreibung">Headline</span>
</div>

.bild { position: relative; }
.beschreibung { position: absolute; bottom: 10px; }
*ungetestet*

das mit deiner tabelle hab ich noch nich so ganz verstanden ... gibts einen link?
 

JPS

Nicht mehr ganz neu hier

AW: <div> mit CSS in einem Table verschachteln

Alles super bis auf den Fakt, dass sich der DIV mit der Schrift nicht zentriert.

Code:
.bikehead {
 font-family: Verdana, Geneva, sans-serif;
 font-size: 24px;
 font-weight: bold;
 color: #F00;
 left: auto;
 right: auto;
 bottom: 10px;
 z-index: 80;
 position: absolute;
}
 

fexx

Aktives Mitglied

AW: <div> mit CSS in einem Table verschachteln

hast du mal einen link?
Code:
width: 100%;
text-align: center;
sollte funktionieren
 

Flashede

Mediengestalter

AW: <div> mit CSS in einem Table verschachteln

da kann ich nur (fexx) zustimmmen, lege doch alles in div containern an (Tabellen sind nicht mehr zeitgemäß)
 

sokie

Mod | Web

AW: <div> mit CSS in einem Table verschachteln

das ist daber wieder eine 'Divterie' wenn es wirkich um eine headline geht!
die elemente h1,h2,h3 etc sind Blockelemente, da ist ein umgebender Div einfach überflüssig.

HTML:
<h1>meine header Übeschrift</h1>
Code:
h1 {
  background: url(meinbild.jpg);
 font-family: Verdana, Geneva, sans-serif;  
 font-size: 24px;  
 font-weight: bold;  
 line-height: 100%;
 padding-top: /*deine Werte*/
 padding-bottom: 10px;
 text-align: center;
für height musst du nun den wert angeben, der deine Bildhöhe abzüglich der paddings und der Überschrift(24px) ist.
oder anders, das padding-top muss so gewählt werden, dass dein background voll zu sehen ist.
 
Zuletzt bearbeitet:

Landorien

(x)HTML-/CSS-Guru

AW: <div> mit CSS in einem Table verschachteln

zu deinen divs ... du könntest es so machen

Code:
<div class="bild">
<img src="" alt="" />
<span class="beschreibung">Headline</span>
</div>

Wie schon einen post über mir erwähnt wurde: Headline = h1-h6 - Tag in logischer Struktur. Ein span-Tag ist ebenso wie ein div-Tag bedeutungslos.

Um "ruckeliges" Seitenaufbauen zu verhindern: immer width und height-Attribute bei img-Tags mit angeben!

Sollte das bild keinen relevanten Inhalt besitzen, also zu Designzwecken verwendet werden -> CSS background.


Gruß
Landorien


P.S.: Periodic Table of the Elements - Josh Duck
 

fexx

Aktives Mitglied

AW: <div> mit CSS in einem Table verschachteln

alles reine spekulation ... um es wirklich perfekt zu machen, hätte man mal das layout sehen müssen, nicht nur eine skizze. wenn die kombination nämlich öfter auf einer seite vorkommt ist das mit den headlines auch nicht die beste wahl ;-) ich dachte eher an eine gallerie (mehrere bilder mit beschreibungen).
 

Landorien

(x)HTML-/CSS-Guru

AW: <div> mit CSS in einem Table verschachteln

alles reine spekulation ... um es wirklich perfekt zu machen, hätte man mal das layout sehen müssen, nicht nur eine skizze....

Layout hat in erster Linie nichts mit HTML zu tun.

wenn die kombination nämlich öfter auf einer seite vorkommt ist das mit den headlines auch nicht die beste wahl ;-)
wieso? Ich kann doch mehrere Überschrift für mehrer Absätze haben?

ich dachte eher an eine gallerie (mehrere bilder mit beschreibungen).
Wieso steht dann Headline und nicht Description da? Eine "Beschreibung" kann, je nach Art eine Textabsatz sein (<p>) oder vllt sogar eine Auflistung von Stichpunkten (<ul>).

Achja..wenn du eine Galerie erstellen willst, dann wäre das eine Auflistung von Bildern:

HTML:
<ul>
   <li>Bild 1</li>
   <li>Bild 2</li>
   <li>Bild 3</li>
</ul>


Gruß
Landorien
 
Bilder bitte hier hochladen und danach über das Bild-Icon (Direktlink vorher kopieren) platzieren.
Antworten auf deine Fragen:
Neues Thema erstellen

Willkommen auf PSD-Tutorials.de

In unseren Foren vernetzt du dich mit anderen Personen, um dich rund um die Themen Fotografie, Grafik, Gestaltung, Bildbearbeitung und 3D auszutauschen. Außerdem schalten wir für dich regelmäßig kostenlose Inhalte frei. Liebe Grüße senden dir die PSD-Gründer Stefan und Matthias Petri aus Waren an der Müritz. Hier erfährst du mehr über uns.

Stefan und Matthias Petri von PSD-Tutorials.de

Nächster neuer Gratisinhalt

03
Stunden
:
:
25
Minuten
:
:
19
Sekunden

Flatrate für Tutorials, Assets, Vorlagen

Statistik des Forums

Themen
175.156
Beiträge
2.581.859
Mitglieder
67.222
Neuestes Mitglied
Gregor
Oben