Grafik soll sich der Größe eines übergeordnten Feldes automatisch anpassen

Status
Nicht offen für weitere Antworten.

VariouStyles

Grünschnabel
Hallo, Hallo, ^^

ich habe vor, zum auflisten einiger Adressen mit Logos, eine Art Gerüst zu erstellen, dem sich die Größen der eingefügten Grafiken direkt anpassen. Dieses sollte eine Art zweigeteilte Box darstellen (ca. 400px breit, 100px hoch) in der, auf der linken Seite die Adresse und auf der rechten Seite das Logo angezeigt wird.

Jedoch habe ich nun folgendes Problem:
Die Logos sind von der Größe her variabel und ich habe keine Ahnung wie ich es managen soll, dass sie den Teilbereich (w200px/h100px) nicht sprengen! Da ich leider nur über html und css Kenntnisse verfüge, habe ich mich darauf verkrampft dieses Problem irgendwie auch ohne php oder Javascript zu lösen.

Meine Überlegungen und Denkansätze:
Also meine ersten Versuche mit Div Containern (div feste Größe, und img 100%) scheiterten genau wie meine versuche ein ähnliches System auf eine Tabelle anzuwenden, da einige Grafiken in die Höhe und andere wiederum in die Breite gehen.

Alles in allem komme ich hier einfach nicht weiter, immer ist irgendwo der Wurm drün. Hat irgendwer da draußen eine Idee wie ich das möglichst mit html/css (zur Not natürlich auch php oder js) realisieren kann? Ich bin für jeden Tipp Dankbar!

Dank und Gruß
Variou§tyles




ps: Letztendlich möchte ich das Gerüst später als FCE (FlexibleContentElement) in Typo3 (CMS) einbinden, von daher ist es so wichtig das sich die Grafik automatisch dem übergeordneten Feld anpasst!
 
Hi,
ein einfacher Vorschlag meinerseits wäre, die Grafik als Background eines Divs zu positionieren, und den Divs die Maximal-Abmessungen zu geben...

Sonst fällt mir nur PHP praktikable Lösung ein (mit Javascript auch, aber was tun wen abgeschalten....)


lg
michi
 
hi michi, ...

danke, das ist eine super idee ... aber irgentwie klappt das bei mir noch nicht so ganz, ...
HTML:
<div style="width: 200px; height: 100px; background-image:url(logo.jpg);">
</div>
Irgentwie bekomme ich es einfach nicht skaliert :(

gruß
vari
 
Mach das Ganze doch einfach mit einem <img>-tag.
Code:
<img border="0" name="bildname" src="source" width="200" height="100">
Bette den Tag in dein Div, mach die höhe passend und alles ist wie gewollt :)
 
Status
Nicht offen für weitere Antworten.
Zurück