Re: [TYPO3-german] powermail - Tooltips
Hallo Peter,
super Erklärung. Mit deiner Hilfe und der von Tobi habe ich es hinbekommen.
Läuft alles traumhaft. Deine Worte werde ich beherzigen.
Viele Grüße einstweilen von
björn
-Ursprüngliche Nachricht-
Von: typo3-german-boun...@lists.typo3.org
[mailto:typo3-german-boun...@lists.typo3.org] Im Auftrag von Peter
Linzenkirchner
Gesendet: Dienstag, 10. Juli 2012 20:02
An: German TYPO3 Userlist
Betreff: Re: [TYPO3-german] powermail - Tooltips
Hallo Tobi,
danke, ist mir beim ersten Durchsehen gar nicht aufgefallen.
@ Björn:
div {
position: relative; /* nie machen */
padding: 0px; /* überflüssig */
border: 0px none; /* überflüssig */
margin: 0px; /* überflüssig */
overflow: hidden; /* nie machen */
}
ist gefährlich ...
Das hier:
* {
padding: 0px;
margin: 0px;
outline: none;
}
bringt m. E. auch mehr Nachteile als Vorteile. Dann lieber das hier:
http://meyerweb.com/eric/tools/css/reset/
Oder die verkürzte Variante von Bootstrap.
--
overflow:hidden ist bei absolut positionierten Containern an sich belanglos:
solange der umgebende Container nicht position:relative hat - dann wirkt es
plötzlich:
http://www.lisardo.de/test/meta/test.html
- oberer Container: position:static; overflow:hidden;
- unterer Container: position:relative; overflow:hidden; Aus genau dem Grund
gibt man nicht allen DIVs pauschal die Eigenschaft position:relative und schon
gar nicht overflow:hidden. Damit werden nicht nur alle Möglichkeiten für
position:absolute und position:relative ausgehebelt, sondern auch negative
margins sind nicht mehr möglich.
overflow:hidden ist nur ein Krücke, um das Clearing von floatenden Boxen zu
erzwingen. Manchmal durchaus praktisch, aber dann muss es sich auf den
umgebenden Container beschränken
div style=overflow:hidden
div style=float:left; width:50%Links/div
div style=float:right; width:50%Links/div /div pder Text, der nicht
mehr floaten soll/p
Nur der äussere Container sollte overflow:hidden bekommen, damit das System
flexibel bleibt. Wenn allerdings die eingeschlossenen Container ein negatives
margin brauchen sollten, geht auch das nicht, dann muss anders gecleart werden.
Gruß
Peter
Am 10.07.2012 um 18:15 schrieb Tobias Liegl:
Am 10.07.12 11:44, schrieb Björn Hahnefeld:
Hallo zusammen,
alle Formulare unserer Webpräsenz habe ich mit powermail realisiert. Auf
einigen Formularen möchte ich gerne Tooltips einsetzen. So auch auf dieser:
http://www.mp-telekommunikation.de/telekommunikation/formular-o2-on.h
tml
Allerdings werden die Tooltips verdeckt. Ich dachte, dass man das mit
z-index übersteuern kann. Doch dem ist nicht so. Jedenfalls nicht mit dem
CSS, welches ich bisher einsetze:
Das Problem ist das overflow: hidden beim umschließenden DIV - was bei
dieser Seite global für alle DIVs gesetzt wird.
Beste Grüße
Tobi
___
TYPO3-german mailing list
TYPO3-german@lists.typo3.org
http://lists.typo3.org/cgi-bin/mailman/listinfo/typo3-german
--
Xing: http://www.xing.com/profile/Peter_Linzenkirchner
Web: http://www.typo3-lisardo.de
Facebook: http://tinyurl.com/lisardo-multimedia
___
TYPO3-german mailing list
TYPO3-german@lists.typo3.org
http://lists.typo3.org/cgi-bin/mailman/listinfo/typo3-german
___
TYPO3-german mailing list
TYPO3-german@lists.typo3.org
http://lists.typo3.org/cgi-bin/mailman/listinfo/typo3-german
Re: [TYPO3-german] powermail - Tooltips
Mahlzeit Tobi, das war der Tipp des Tages für dieses Problem :)! Mein Kollege hat da wohl etwas übereifrig den overflow integriert. Jedenfalls läuft es jetzt :)! Nochmals dankeschön und liebe Grüße Björn -Ursprüngliche Nachricht- Von: typo3-german-boun...@lists.typo3.org [mailto:typo3-german-boun...@lists.typo3.org] Im Auftrag von Tobias Liegl Gesendet: Dienstag, 10. Juli 2012 18:15 An: typo3-german@lists.typo3.org Betreff: Re: [TYPO3-german] powermail - Tooltips Am 10.07.12 11:44, schrieb Björn Hahnefeld: Hallo zusammen, alle Formulare unserer Webpräsenz habe ich mit powermail realisiert. Auf einigen Formularen möchte ich gerne Tooltips einsetzen. So auch auf dieser: http://www.mp-telekommunikation.de/telekommunikation/formular-o2-on.ht ml Allerdings werden die Tooltips verdeckt. Ich dachte, dass man das mit z-index übersteuern kann. Doch dem ist nicht so. Jedenfalls nicht mit dem CSS, welches ich bisher einsetze: Das Problem ist das overflow: hidden beim umschließenden DIV - was bei dieser Seite global für alle DIVs gesetzt wird. Beste Grüße Tobi ___ TYPO3-german mailing list TYPO3-german@lists.typo3.org http://lists.typo3.org/cgi-bin/mailman/listinfo/typo3-german ___ TYPO3-german mailing list TYPO3-german@lists.typo3.org http://lists.typo3.org/cgi-bin/mailman/listinfo/typo3-german
Re: [TYPO3-german] powermail - Tooltips
Setzt wohl keiner ein, dieses powermail-Dingens?
-Ursprüngliche Nachricht-
Von: typo3-german-boun...@lists.typo3.org
[mailto:typo3-german-boun...@lists.typo3.org] Im Auftrag von Björn Hahnefeld
Gesendet: Dienstag, 10. Juli 2012 11:44
An: typo3-german@lists.typo3.org
Betreff: [TYPO3-german] powermail - Tooltips
Hallo zusammen,
alle Formulare unserer Webpräsenz habe ich mit powermail realisiert. Auf
einigen Formularen möchte ich gerne Tooltips einsetzen. So auch auf dieser:
http://www.mp-telekommunikation.de/telekommunikation/formular-o2-on.html
Allerdings werden die Tooltips verdeckt. Ich dachte, dass man das mit z-index
übersteuern kann. Doch dem ist nicht so. Jedenfalls nicht mit dem CSS, welches
ich bisher einsetze:
--
#main_content_box.medienagentur .tx-powermail-pi1
.tx_powermail_pi1_fieldwrap_html a dfn {
display:none !important;
}
#main_content_box.medienagentur .tx-powermail-pi1
.tx_powermail_pi1_fieldwrap_html a:hover dfn {
display: block !important;
position: absolute;
width: 250px;
padding: 5px;
margin:2px 0 0 100px;
background-color: #ddd;
/*border: 1px solid red;*/
color: black;
text-decoration: none;
font-family: 'YanoneKaffeesatzLight', Arial, sans-serif;
font-size:14px;
z-index: 99;
}
--
Wer hat eine pfiffige Idee auf Lager und schon ein ähnliches Problem gehabt?
Viele Grüße
Björn
___
TYPO3-german mailing list
TYPO3-german@lists.typo3.org
http://lists.typo3.org/cgi-bin/mailman/listinfo/typo3-german
___
TYPO3-german mailing list
TYPO3-german@lists.typo3.org
http://lists.typo3.org/cgi-bin/mailman/listinfo/typo3-german
Re: [TYPO3-german] powermail - Tooltips
Hallo Björn,
die Position eines position:absolute-Containers wird nicht margin und padding
bestimmt sondern mit top/bottom und right/left. Ausserdem musst du ein width /
height angeben. Ansonsten gilt:
top und left sind relativ zum ersten umgebenenden Container mit dem Attribut
position:relative
z-index ist immer in Relation du diesem Container zu sehen: wenn der ein
höheres z-index hat, überdeckt er.
Das musst du entsprechend analysieren.
Mit Powermail hat das nichts zu tun.
Gruß
Peter
Am 10.07.2012 um 11:44 schrieb Björn Hahnefeld:
Hallo zusammen,
alle Formulare unserer Webpräsenz habe ich mit powermail realisiert. Auf
einigen Formularen möchte ich gerne Tooltips einsetzen. So auch auf dieser:
http://www.mp-telekommunikation.de/telekommunikation/formular-o2-on.html
Allerdings werden die Tooltips verdeckt. Ich dachte, dass man das mit z-index
übersteuern kann. Doch dem ist nicht so. Jedenfalls nicht mit dem CSS,
welches ich bisher einsetze:
--
#main_content_box.medienagentur .tx-powermail-pi1
.tx_powermail_pi1_fieldwrap_html a dfn {
display:none !important;
}
#main_content_box.medienagentur .tx-powermail-pi1
.tx_powermail_pi1_fieldwrap_html a:hover dfn {
display: block !important;
position: absolute;
width: 250px;
padding: 5px;
margin:2px 0 0 100px;
background-color: #ddd;
/*border: 1px solid red;*/
color: black;
text-decoration: none;
font-family: 'YanoneKaffeesatzLight', Arial, sans-serif;
font-size:14px;
z-index: 99;
}
--
Wer hat eine pfiffige Idee auf Lager und schon ein ähnliches Problem gehabt?
Viele Grüße
Björn
___
TYPO3-german mailing list
TYPO3-german@lists.typo3.org
http://lists.typo3.org/cgi-bin/mailman/listinfo/typo3-german
--
Xing: http://www.xing.com/profile/Peter_Linzenkirchner
Web: http://www.typo3-lisardo.de
Facebook: http://tinyurl.com/lisardo-multimedia
___
TYPO3-german mailing list
TYPO3-german@lists.typo3.org
http://lists.typo3.org/cgi-bin/mailman/listinfo/typo3-german
Re: [TYPO3-german] powermail - Tooltips
Am 10.07.12 11:44, schrieb Björn Hahnefeld: Hallo zusammen, alle Formulare unserer Webpräsenz habe ich mit powermail realisiert. Auf einigen Formularen möchte ich gerne Tooltips einsetzen. So auch auf dieser: http://www.mp-telekommunikation.de/telekommunikation/formular-o2-on.html Allerdings werden die Tooltips verdeckt. Ich dachte, dass man das mit z-index übersteuern kann. Doch dem ist nicht so. Jedenfalls nicht mit dem CSS, welches ich bisher einsetze: Das Problem ist das overflow: hidden beim umschließenden DIV - was bei dieser Seite global für alle DIVs gesetzt wird. Beste Grüße Tobi ___ TYPO3-german mailing list TYPO3-german@lists.typo3.org http://lists.typo3.org/cgi-bin/mailman/listinfo/typo3-german
Re: [TYPO3-german] powermail - Tooltips
Hallo Tobi,
danke, ist mir beim ersten Durchsehen gar nicht aufgefallen.
@ Björn:
div {
position: relative; /* nie machen */
padding: 0px; /* überflüssig */
border: 0px none; /* überflüssig */
margin: 0px; /* überflüssig */
overflow: hidden; /* nie machen */
}
ist gefährlich ...
Das hier:
* {
padding: 0px;
margin: 0px;
outline: none;
}
bringt m. E. auch mehr Nachteile als Vorteile. Dann lieber das hier:
http://meyerweb.com/eric/tools/css/reset/
Oder die verkürzte Variante von Bootstrap.
--
overflow:hidden ist bei absolut positionierten Containern an sich belanglos:
solange der umgebende Container nicht position:relative hat - dann wirkt es
plötzlich:
http://www.lisardo.de/test/meta/test.html
- oberer Container: position:static; overflow:hidden;
- unterer Container: position:relative; overflow:hidden;
Aus genau dem Grund gibt man nicht allen DIVs pauschal die Eigenschaft
position:relative und schon gar nicht overflow:hidden. Damit werden nicht nur
alle Möglichkeiten für position:absolute und position:relative ausgehebelt,
sondern auch negative margins sind nicht mehr möglich.
overflow:hidden ist nur ein Krücke, um das Clearing von floatenden Boxen zu
erzwingen. Manchmal durchaus praktisch, aber dann muss es sich auf den
umgebenden Container beschränken
div style=overflow:hidden
div style=float:left; width:50%Links/div
div style=float:right; width:50%Links/div
/div
pder Text, der nicht mehr floaten soll/p
Nur der äussere Container sollte overflow:hidden bekommen, damit das System
flexibel bleibt. Wenn allerdings die eingeschlossenen Container ein negatives
margin brauchen sollten, geht auch das nicht, dann muss anders gecleart werden.
Gruß
Peter
Am 10.07.2012 um 18:15 schrieb Tobias Liegl:
Am 10.07.12 11:44, schrieb Björn Hahnefeld:
Hallo zusammen,
alle Formulare unserer Webpräsenz habe ich mit powermail realisiert. Auf
einigen Formularen möchte ich gerne Tooltips einsetzen. So auch auf dieser:
http://www.mp-telekommunikation.de/telekommunikation/formular-o2-on.html
Allerdings werden die Tooltips verdeckt. Ich dachte, dass man das mit
z-index übersteuern kann. Doch dem ist nicht so. Jedenfalls nicht mit dem
CSS, welches ich bisher einsetze:
Das Problem ist das overflow: hidden beim umschließenden DIV - was bei
dieser Seite global für alle DIVs gesetzt wird.
Beste Grüße
Tobi
___
TYPO3-german mailing list
TYPO3-german@lists.typo3.org
http://lists.typo3.org/cgi-bin/mailman/listinfo/typo3-german
--
Xing: http://www.xing.com/profile/Peter_Linzenkirchner
Web: http://www.typo3-lisardo.de
Facebook: http://tinyurl.com/lisardo-multimedia
___
TYPO3-german mailing list
TYPO3-german@lists.typo3.org
http://lists.typo3.org/cgi-bin/mailman/listinfo/typo3-german
