---
title: "Inhaltselement Bilder Responsive - styles.content.imgtext.maxW = \"% Wert\""
url: "https://www.typo3.net/d/114537-inhaltselement-bilder-responsive-stylescontentimgtextmaxw-wert"
source: "typo3.net"
tags: ["TYPO3","TypoScript","Bilder","Frage","Inhaltselemente"]
created: "2013-04-13"
last_reply: "2013-05-17"
replies: 3
solved: false
page: 1
pages: 1
lang: "de"
---

# Inhaltselement Bilder Responsive - styles.content.imgtext.maxW = "% Wert"

TYPO3 › TypoScript · 3 Antworten · gestartet 2013-04-13

## Eröffnungsbeitrag

**sala** · 2013-04-13 · [Beitrag #1](https://www.typo3.net/d/114537-inhaltselement-bilder-responsive-stylescontentimgtextmaxw-wert/1)

Hallo,
habe in Typo3 4.7.4 ein Responsive Design mit 3 Spalte. Breite in % aufgeteilt.
Wenn ich nun ein Inhaltselemt "Bilder" mit 3 Bilder und Anzeige in 3 Spalten erstelle, ohne Größenangabe, nimmt er natürlich den Wert von styles.content.imgtext.maxW her und teilt die 3 Spalten auf diesen Wert auf.
Dann zeigt bei kleinerem Container zb nur 2 nebeneinander an.

Kann hier irgendwie 100% der Containergröße angegeben werden?

Vielen Dank,
Sandro

## Antworten

### [#2](https://www.typo3.net/d/114537-inhaltselement-bilder-responsive-stylescontentimgtextmaxw-wert/2) · dausi2013 · 2013-04-30

Hallo Sala,

indem Du das Layout Element wrappst kannst Du per CSS auch das Bild auslesen und so im CSS die Bildgröße bestimmen.

```typoscript
    tt_content {
     stdWrap.innerWrap.cObject.default {
      20 {
       15 = TEXT
       15.dataWrap = layout-{field:layout}
       15.noTrimWrap = || |
      }
     }
    }
```

Wenn Du im Inhaltselement nun Standard als Layout ausgewählt hast, wirst Du es im Quelltext mit dem Wrap "layout-0" wiederfinden.

Per CSS kannst Du nun mit .layout-0 und der entsprechenden Klasse das Bild direkt ansprechen.

Zum Beispiel

```css
.layout-0 .csc-textpic-last img {
width: 100%;
max-width: 200px;
height: auto;
}
```

oder übergreifend für alle Bilder innerhalb des Inhaltselements:

```css
.layout-0 img {
width: 100%;
max-width: 200px;
height: auto;
}
```

Viele Grüße
Dausi

### [#3](https://www.typo3.net/d/114537-inhaltselement-bilder-responsive-stylescontentimgtextmaxw-wert/3) · kuse · 2013-05-16

Hallo

Ich habe es so gelöst, dass ich dem wrap um die Bilder die jeweilige Spaltenanzahl mitgebe:

```typoscript
tt_content.image.20 {
    rendering.noCaption.allStdWrap.wrap = <div class="csc-textpic-imagewrap csc-textpic-{field:imagecols}-col"> | </div>
    rendering.noCaption.allStdWrap.wrap.insertData = 1
}
```

In meinem CSS setze ich dann die Breite der Bildspalte, indem ich diese mittels des oben mitgegebenen Selectors anspreche:

```css
.csc-textpic-2-col .csc-textpic-imagecolumn { width:48% }
.csc-textpic-3-col .csc-textpic-imagecolumn { width:31% }
```

Dabei gilt es sicher noch einiges zu beachten, wie z.B. der Abstand zwischen den Bildern, captions, usw.
Bei meinem (einfachen) Layout funktioniert dies aber einwandfrei.

Grüsse
Kuse

### [#4](https://www.typo3.net/d/114537-inhaltselement-bilder-responsive-stylescontentimgtextmaxw-wert/4) · karlchen · 2013-05-17

in CSS ein max-width:100% sollte doch komplett ausreichen oder nicht ?

---

Quelle: „Inhaltselement Bilder Responsive - styles.content.imgtext.maxW = "% Wert"“, typo3.net, https://www.typo3.net/d/114537-inhaltselement-bilder-responsive-stylescontentimgtextmaxw-wert
Beiträge von Mitgliedern des Forums. Bitte mit Link auf die Diskussion zitieren.