Preisboxen

TA LIGHT
200GB

49,99 39,99 €
12 Monate, danach 49,99 €/Mon.

inkl. Smartphone

FLAT Telefonie
In alle Fest- und Mobilfunknetze

FLAT SMS

FLAT Internet
200 GB/Monat

TA LARGE
400GB

59,99 49,99 €
12 Monate, danach 59,99 €/Mon.

inkl. Smartphone

FLAT Telefonie
In alle Fest- und Mobilfunknetze

FLAT SMS

FLAT Internet
400 GB/Monat

TA X-LARGE
600GB

69,99 59,99 €
12 Monate, danach 69,99 €/Mon.

inkl. Smartphone

FLAT Telefonie
In alle Fest- und Mobilfunknetze

FLAT SMS

FLAT Internet
600 GB/Monat

Solche Boxen kann man sehr gut mit der Linkbox realisieren. Allerdings werden die Boxen vom Gridsystem skaliert, hier kommt es manchmal zu unschönen Darstellungen. Hier kümmern wir uns selbst um den Umbruch und zentrieren die Boxen. Skaliert wird erst wenn der Bildschirm so klein ist das eine einzelne Box abgeschnitten werden würde.
Die Anpassungen für euere Boxenbreite zur Seitenbreite passt ihr in der CSS-Klasse ".cont" an.
In diesem Beispiel ist die Seite 930px breit, und eine Box 290px breit.

Überschrift

Diesen Code per Einstellungen > CSS einfügen und anpassen.

.cont {
   margin: 0 auto;
   width: 930px;
}
@media (max-width: 970px) {
.cont {
   width: 620px;
}}
@media (max-width: 659px) {
.cont {
   width: 310px;
}}
@media (max-width: 349px) {
.cont {
   width: 100%;
}}
@media (max-width: 349px) {
.box a {
   width: 100%;
	margin: 10px 0;
}}
</style>

markieren & kopieren

Quellcode

Diesen Code per Widget > Quelltext einfügen und anpassen.

<div class="box"><a href="#">
<div class="boxhead">TA LIGHT<br>200GB</div>
<div class="triangle"></div>
<p><span class="boxpreisalt">49,99</span><span class="boxpreis"><strong> 39,99 €</span></strong><br>12 Monate, danach 49,99 €/Mon.</p>
<p><img src="https://www.zella.de/bilder/smartphone.png" width="260" alt=""><br><span style="font-size: large">inkl. Smartphone</span></p>
<hr>
<p><span class="boxflat">FLAT Telefonie</span><br>In alle Fest- und Mobilfunknetze</p>
<hr>
<p><span class="boxflat">FLAT SMS</span></p>
<hr>
<p><span class="boxflat">FLAT Internet</span><br><span style="font-size: large">200 GB/Monat</span></p>
<span class=""></span>
</a>
</div>

<div class="box"><a href="#">
<div class="boxhead">TA LARGE<br>400GB</div>
<div class="triangle"></div>
<p><span class="boxpreisalt">59,99</span><span class="boxpreis"><strong> 49,99 €</span></strong><br>12 Monate, danach 59,99 €/Mon.</p>
<p><img src="https://www.zella.de/bilder/smartphone.png" width="260" alt=""><br><span style="font-size: large">inkl. Smartphone</span></p>
<hr>
<p><span class="boxflat">FLAT Telefonie</span><br>In alle Fest- und Mobilfunknetze</p>
<hr>
<p><span class="boxflat">FLAT SMS</span></p>
<hr>
<p><span class="boxflat">FLAT Internet</span><br><span style="font-size: large">400 GB/Monat</span></p>
<span class="new"></span>
</a>
</div>

<div class="box"><a href="#">
<div class="boxhead">TA X-LARGE<br>600GB</div>
<div class="triangle"></div>
<p><span class="boxpreisalt">69,99</span><span class="boxpreis"><strong> 59,99 €</span></strong><br>12 Monate, danach 69,99 €/Mon.</p>
<p><img src="https://www.zella.de/bilder/smartphone.png" width="260" alt=""><br><span style="font-size: large">inkl. Smartphone</span></p>
<hr>
<p><span class="boxflat">FLAT Telefonie</span><br>In alle Fest- und Mobilfunknetze</p>
<hr>
<p><span class="boxflat">FLAT SMS</span></p>
<hr>
<p><span class="boxflat">FLAT Internet</span><br><span style="font-size: large">600 GB/Monat</span></p>
<span class=""></span>
</a>
</div>

</div>

markieren & kopieren

Preisboxen

Überschrift

Quellcode

NEUE BEITRÄGE