Hi,
ich möchte auf einer Impressumseite die Angaben wie eine Tabelle (2 Spalten) nur halt in CSS layouten.
Hat da jemand einen Link zu einer Bsp-Seite ? Ich furhwerke seit 2 Stunden mit floats etc. herum und es klappt einfach nicht. Auch die 2-coloumn-Layout Extension hat mir nciht wirklcih geholfen, da er ja die div-Tags elementeweise ausliest und somit z.b. ein static-Layout wieder zerstört.
Thx 4 help
Hi,
jepp das hab ich als aller erstes versucht. Das Problem ist, daß er ja die einzelnen Impressumsfelder dynamisch aus der DB generiert. Damit wird es beim ersten Durchlauf richtig gelayoutet. die linke Spalte der 2. "Zeile" wird aber wieder relativ zur rechten Spalte der 1. Zeile definiert und damit ergibt sich nach rechts absteigende Treppe bei mir.
bei "position: absolute" schreibt er mir natuerlich alle Zeilen exakt übereinander.
Es soll so aussehen wie eine klassische Tabelle mit 6 Reihen und 2 Spalten... die sind jeweils leicht mit einer Hintergrundfarbe gefüllt und enthalten in der linken Spalte quasi die Feldnamen (Name,Adresse...) und in der rechten den Inhalt.
Genau das kann ich ja in der 2Coloumns Extension definieren. Für jeweils eine Tabellenzeile habe ihc ein neues Seitenelement einfügen müssen. Diese nun mit CSS so zu formatieren, daß das Tabellen-Layout entsteht, sollte nicht so schwer sein, ist es aber bisher :).. any ideas oder Links zu nem Beispiel ?
Sodale, nach einigem hin und her hab ich jetzt eine vernünftige Lösung gefunden... anbei mal die CSS-Datei , die Coloumns lassen sich mit
"div.c2l1d-middle" und "div.c2l1d-left" ansprechen.
Allerdings habe ich dafür im Plugin den Default-CSS-Style aus der ...setup.txt-Datei löschen müssen.
Außerdem mußte ich das Plugin-Layout auf "pure CSS" umstellen, dies ging im TS-Template mit "plugin.tx_fdfx2cols_pi1.templateFile = EXT:fdfx_2cols/tpl.2column.div.html"
Die CSS-Datei
[HTML]#content_normal_container {
position : absolute;
left : 40px;
top : 179px;
width : 912px;
height: 600px;
padding-right: 20px;
padding-left: 20px;
padding-top: 25px;
background-color : rgb(252,253,253);
overflow: auto;
border-top-width: 0px;
border-bottom-width: 1px;
border-right-width: 1px;
border-left-width: 1px;
border-style: solid;
border-color: #8ac2c2;
}
.bodytext {
font-family : Verdana, sanserif;
text-align: left;
font-size : 12px;
color : rgb(79,181,182);
}
div.c2l1d-left {
float: left;
margin-left: 6%;
width: 16%;
background-color: rgb(229,244,245);
}
div.c2l1d-left p {
margin: 10px;
color : rgb(79,181,182);
font-weight: bold;
}
div.c2l1d-middle a {
color : rgb(79,181,182);
}
div.c2l1d-middle {
background-color: rgb(229,244,245);
margin-left: 23%;
width : 28%;
}
div.c2l1d-middle p {
padding: 10px;
color : rgb(79,181,182);
}
DIV.csc-header-n11 h1 {
position: absolute;
top: 90px;
margin-left: 53%;
font-family : Verdana, sanserif;
font-size : 15px;
color : rgb(79,181,182);
}
#disclaimtext {
position: absolute;
top: 115px;
margin-left: 53%;
font-family : Verdana, sanserif;
font-size : 11px;
text-align: justify;
color : rgb(79,181,182);
width: 350px;
}
[/HTML]
