Page 2 of 2

Posted: Tue 22. May 2007, 19:14
by kukki
Dieses custom DIV Layout (also nur im Hauptbereich) sollte funktionieren. http://www.positioniseverything.net/piefecta-rigid.html
Hast Du Dir mal das Teil genauer angeschaut (im FF):
Scrolle mal mit dem Mouse-Rädchen und dann mal mit dem Scrollbalken und achte auf den Hintergrund! :P :P

Posted: Tue 22. May 2007, 19:17
by flip-flop
Was soll damit sein? :shock:

Posted: Wed 23. May 2007, 07:37
by kukki
Dann schau einfach h i e r

Posted: Wed 23. May 2007, 07:49
by flip-flop
Hallo kukki,

ich weiß nicht was für ein Feature das in deinem Browser ist, bei mir funktioniert es problemlos. FF 1.5/2.x IE 6/7.
Hier ist noch ein Layout das etwas schlanker im CSS-Teil ist und mit nur einem CSS-Browser-hacks auskommt. http://www.brunildo.org/test/twocols.html Ist eine Weiterentwicklung des o.g. Layouts und beschränkt sich auf das Wesentlich.

Das ist der entscheidende Satz: Any column may be longest. All the columns are floated. Und schon klappt es auch mit dem clear in einem Container.

Knut

Posted: Wed 23. May 2007, 08:52
by pico
und noch etwas Background über floats ;)

http://www.yaml.de/yaml_xhtml_struktur.html

Posted: Wed 23. May 2007, 11:35
by kukki
flip-flop wrote:Hallo kukki,

ich weiß nicht was für ein Feature das in deinem Browser ist, bei mir funktioniert es problemlos. FF 1.5/2.x IE 6/7.

Knut
Gut, lassen wir das, es sprengt ja auch den Rahmen hier, aber ich habe gar keinen FF1.5x mehr :D :D :D Ist ja auf der Aufzeichnung zu sehen, was passiert!
Ich verwende seit langer Zeit bereits 2.0 ---> vielleicht liegt es daran ... egal. :?: :!:

Posted: Wed 23. May 2007, 14:06
by flip-flop
Ich verwende seit langer Zeit bereits 2.0 ---> vielleicht liegt es daran ...
Nein, wie oben geschrieben, getestest in FF 1.5 / 2.x ....... unter WIN.

Um die Sache zum Abschluss zu bringen, hier drei Lösungen:

Lösung Nr. 1
--------------------------
Für das Standard Layout in phpWcms.
Ein Blick in Dirk Jesses http://www.yaml.de/css//main/iehacks.css zeigt einen gangbaren Weg auf.
Eine zusätzlicher Container floatbox wird angelegt, der sich um jede Zeile der Bildausgabe legt. Die Anweisung clear:both entfällt.
1. Das Template für die images: /template/inc_cntpart/images/layout_standard_div.tmpl (Bitte Datei anlegen).

Code: Select all

<!--IMAGES_HEADER_START//-->

[TITLE]standard_<h1>{TITLE}</h1>[/TITLE]
[SUBTITLE]<h2>{SUBTITLE}</h2>[/SUBTITLE]
[TEXT]{TEXT}[/TEXT]

<div class="images" id="images{ID}">
<div class="floatbox"><!-- === used for the standard DIV layout KH (flip-flop) 23.05.07 === //-->
<!--IMAGES_HEADER_END//-->


<!--IMAGES_ENTRY_START//-->
	<div class="imageEntry" style="float:left;padding:5px;border:1px solid #CCCCCC;margin:5px 5px 0 0;">
		{IMAGE}[CAPTION]
		<p style="margin:3px 0 0 0;">{CAPTION}</p>[/CAPTION]
	</div>
<!--IMAGES_ENTRY_END//-->


<!--IMAGES_ENTRY_SPACER_START//--><!-- space between images "{SPACE}px" --><!--IMAGES_ENTRY_SPACER_END//-->


<!--IMAGES_ROW_SPACER_START//--></div><div class="floatbox"><!--<br style="clear:both" />//--><!-- space between image rows --><!--IMAGES_ROW_SPACER_END//-->


<!--IMAGES_FOOTER_START//-->
</div><!-- === floatfix-End === //-->
<!-- <br style="clear:both" /> //-->
</div><!-- === images-End === //-->
<!--IMAGES_FOOTER_END//-->
2. die passende Klasse dazu in z.B. der frontend.css

Code: Select all

/* Clearen per Overflow */
.floatbox { overflow:hidden; }

/* .floatbox-Anpassung für IE */
/* Hides from IE-mac \*/
* html .floatbox {width:99%;}
/* End hide from IE-mac */
Sollte nun in den gängigen Browsern funktionieren.
Dazu auch:
- http://www.yaml.de/yaml_xhtml_struktur.html
- http://www.yaml.de/artikel/xhtml/floats.html


Lösung Nr. 2
--------------------------
Ohne die sample.tmpl verändern zu müssen:
z.B.: frontend.css

Code: Select all

.main {float: left; width: auto; margin: 0; padding: 0; background-color: #DFE6E4;}
Vorlage Hauptbereich:

Code: Select all

<div class="main">{CONTENT}</div>
Lösung Nr. 3
--------------------------
Anderes Layout verwenden:
1. Dieses custom DIV Layout (also nur im Hauptbereich) sollte funktionieren. (Von einem der float - Päpste persönlich "Big-John").
http://www.positioniseverything.net/piefecta-rigid.html (Mit Generator).

2. Das ist eine schlanke Weiterentwicklung des Piefecta Layouts von Bruno Fassino http://www.brunildo.org/test/twocols.html und beschränkt sich auf das Wesentlich. (Sehr robust).
--------------------------

Natürlich ist es immer gut auch die Klassen images und imageEntry anzulegen, ist aber kein muss.

Knut

Posted: Thu 24. May 2007, 13:08
by Freundschaft
vielen dank, hhm ich werde mal versuchen was ich hinkriege ^^

war das ganze so gedacht?

http://www.fahrradwagner.de/phpwcms/ind ... ,0,0,1,0,0

hab mal lösung 3 probiert

Posted: Thu 24. May 2007, 15:24
by flip-flop
Lösung 3: Siehe doch schon ganz gut aus. Ich habe den Generator pers. nie verwendet.

Du darfst natürlich nur den Teil zwischen <body> und </body> einfügen.

Den CSS Kram in z.b. eine separat CSS die du dann im Vorlagenteil oben einbindest.

Kanst aber auch mal Lösung 3: 2. ausprobieren.

Jetzt fehlt eigentlich nur noch ein zeitgemäßes Menü.

Knut

Posted: Sat 26. May 2007, 12:12
by Freundschaft
wo krieg ich sowas her? ^^ oder gibs da nen vorschlag?

Posted: Sat 26. May 2007, 12:56
by flip-flop
Meinst du die Navigation? NAV_LIST_UL: http://www.phpwcms.de/forum/viewtopic.php?t=14273

Knut

Posted: Mon 28. May 2007, 18:21
by Freundschaft
top danke ^^