|
||||
Faux coloums ohne Hintergrundgrafik.
Moin
So jetzt ist das Menü fertig. Nun gehts an die Startseite Die sieht in der alten Version mit Tabellen so aus: http://www.the-holics.de/start.php (es geht nur um das orange/blau) Das möchte ich nun ohne diese gratligen Tabellen nachbauen, sprich mit divs. Und CSS. Ich habe bereits vorgearbeitet und ein Modell für die box entworfen. Dabei sind die äußeren ecken png's. Man muss sich das so verstellen das das was jetzt bei der Ecke orange ist, in der png Version transparent also durchsichtig ist. Somit hat die ecke immer die Farbe des Backgrounds der Box in der sie sich befindet. Der Code schaut dann so aus: CSS: Code:
.eckeoben div { background: url(ecke1.png) no-repeat top left ; } .eckeoben { background: url(ecke2.png) no-repeat top right; } .eckeunten div { background: url(ecke3.png) no-repeat bottom left; } .eckeunten { background: url(ecke4.png) no-repeat bottom right; } .eckeoben div, .eckeoben, .eckeunten div, .eckeunten { height: 18px; } .orange { background-color: #F89724; width: 29%; } Code:
<div class="orange"> <div class="eckeoben"><div></div></div> Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Duis ornare ultricies libero. Donec fringillha, eros at dapibus fermentum, tellus tellus auctor erat, vitae porta magna libero sed libero. Mauris sed leo. Aliquam aliquam. Maecenas vestibulum. <div class="eckeunten"><div></div></div> </div> http://www.the-holics.de/middle/middle.html Wie ihr seht sind auf meiner page aber 2 solche Boxen die nebeneinander gleich hoch positioniert sind. Wenn man 2 Boxen die gleich lang sein sollen nimmt man ja eig Faux coloums. Dies ist aber bei mir nicht möglich da 1. Das Design keine feste Breite in px oder so hat und 2. Man nicht weiß welche Box mal die längere bzw die kürzere ist. Kennt jemand nen Trick der die Höhe zweier Blocke angleicht ohne eine Hintergrundgrafik zu benutzen? Danke MfG Zen |
Sponsored Links |
|
||||
Ich sehe nur eine Box
Und nein, es geht nicht. Zwei DIVs können sich nicht automatisch aneinander anpassen - mit einem kleinen JavaScript würde das gehen, aber mit CSS allein nicht. Schau dir mal aber das hier an: http://www.html.it/articoli/niftycube/index.html
__________________
“My software never has bugs. It just develops random features ...” » DevShack - die Website des freien Webentwicklers Boris Bojic |
Sponsored Links |
Themen-Optionen | |
Ansicht | |
|
|
Ähnliche Themen | ||||
Thema | Autor | Forum | Antworten | Letzter Beitrag |
Variable Breite -> Problem Hintergrundgrafik | Korasu | CSS | 2 | 08.01.2010 01:26 |
Hintergrundgrafik und flexible Spaltenbreite | Teaser | CSS | 1 | 27.11.2009 16:52 |
Hintergrundgrafik für Faux Columns | andreak | CSS | 12 | 02.05.2007 12:33 |
Faux Coloumns und Liquid Faux Coloumns | michael-r | CSS | 9 | 31.01.2007 15:16 |
[SOLVED]IE 3px float bug + faux coloums führt zu Bauchschmerzen. | Zen5656 | CSS | 1 | 02.10.2006 02:04 |