[Elefant]

Hallo,
Die Doku von Powermail ist ist schon spitzenmäßige und in der neuen Version auch hinweise zu css. Leider sind die Infos für mich noch nicht ausreichend .

Ich bekomme die Radio Button einfach mit css nicht formatiert.
Wie bekommen ich den Titel, Label formatiert?

Gruß Eckhard

[einpraegsam.net]

Zitat von Elefant

Hallo,
Die Doku von Powermail ist ist schon spitzenmäßige und in der neuen Version auch hinweise zu css. Leider sind die Infos für mich noch nicht ausreichend .

Ich bekomme die Radio Button einfach mit css nicht formatiert.
Wie bekommen ich den Titel, Label formatiert?

Gruß Eckhard

Wie sollen diese denn ausschauen? Wie ist dein HTML Quellcode?

[Elefant]

Zitat von wunschtacho

Wie sollen diese denn ausschauen? Wie ist dein HTML Quellcode?

Ich möchte es erstmal nur so haben wie in der Doku.
In einer Zeile "Anrede Frau O Herr O" und in der nächste Vorname _____

Habe ich bis jetzt nur eins für die gesamte Webseite.

[einpraegsam.net]

Hier mal ein Beispiel CSS zu dieser Seite:

fieldset.tx-powermail-pi1_fieldset_3 input.powermail_uid42 {
	width: 20px;
	border: none;
}
input.powermail_subuid42_1 {
	margin-left: 60px;
}
fieldset.tx-powermail-pi1_fieldset_3 div.tx_powermail_pi1_fieldwrap_html_42 label {
	display: inline;
	float: none;
	clear: none;
	margin: 0;
	width: 20px;
}
fieldset.tx-powermail-pi1_fieldset_3 p.tx_powermail_pi1_fieldwrap_html_radio_title {
	display: block;
	float: left;
	width: 100px;
	margin-right: 10px;
}
div.tx_powermail_pi1_fieldwrap_html {
	clear: both;
}

[Speedyletti]

hallo zusammen, ich (wie viele andere) kämpfe mit dem selben problem. eigentlich dachte ich, dass ich einigermassen fit mit css bin, jedoch powermail bringt mich zum zweifeln.

leider bekomme ich eine normale darstellung welche in ie & firefox schön dargestellt wird nicht hin. entweder ist alles durcheinander oder je nach browser sind die check & radiobuttons unter oder nebeneinander.

schön wäre es, wenn jemand ein standart css hätte, welches für alle "normalen" powermailformulare auf einer seite funktionieren würde.

wunschdarstellung:

beschreibung: [eingabefeld]
beschreibung: [eingabefeld]
beschreibung: [eingabefeld]
checkboxen : [untereinander]

[absenden]

merci für eure inputs - marcel

[einpraegsam.net]

Beispiel: Checkboxen untereinander (tmpl_fieldwrap.html)

<!-- ###POWERMAIL_FIELDWRAP_HTML_CHECK### begin --> <div class="tx_powermail_pi1_fieldwrap_html tx_powermail_pi1_fieldwrap_html_check tx_powermail_pi1_fieldwrap_html_###POWERMAIL_FIELD_UID###"> <p class="tx_powermail_pi1_fieldwrap_html_checkbox_title">###LABEL_MAIN######MANDATORY_SYMBOL###</p> <!-- ###CONTENT### begin --> <!-- ###ITEM### begin --> <label for="###LABEL_NAME###">###LABEL###</label> <input type="checkbox" ###NAME######VALUE######CLASS######ID######CHECKED###/> <!-- ###ITEM### end --> <!-- ###CONTENT### end --> </div> <!-- ###POWERMAIL_FIELDWRAP_HTML_CHECK### end -->

Ersetzen durch:

<!-- ###POWERMAIL_FIELDWRAP_HTML_CHECK### begin --> <div class="tx_powermail_pi1_fieldwrap_html tx_powermail_pi1_fieldwrap_html_check tx_powermail_pi1_fieldwrap_html_###POWERMAIL_FIELD_UID###"> <p class="tx_powermail_pi1_fieldwrap_html_checkbox_title">###LABEL_MAIN######MANDATORY_SYMBOL###</p> <!-- ###CONTENT### begin --> <!-- ###ITEM### begin --> <div class="deineklasse"> <label for="###LABEL_NAME###">###LABEL###</label> <input type="checkbox" ###NAME######VALUE######CLASS######ID######CHECKED###/> </div> <!-- ###ITEM### end --> <!-- ###CONTENT### end --> </div> <!-- ###POWERMAIL_FIELDWRAP_HTML_CHECK### end -->

[Speedyletti]

hallo wunschtacho,

whow, das ging ja schnell! und hat wunderbar geklappt.
die checkboxen sind jetzt untereinander - die radio buttons noch nicht.

warum hast du dies in html und nicht im css als änderung vorgeschlagen?

gruss marcel

[einpraegsam.net]

Zitat von Speedyletti

die checkboxen sind jetzt untereinander - die radio buttons noch nicht.

Das kannst du natürlich auch bei den Radio Buttons machen

Zitat von Speedyletti

warum hast du dies in html und nicht im css als änderung vorgeschlagen?

Das kannst du auch über CSS lösen wenn du magst. Mein Kollege und ich finden aber ein weiteres DIV besser, weil man mehr Möglichkeiten hat.

[Speedyletti]

wunschtacho, merci für deine hilfe, es hat mich gefreut mit dem powermail meister selbst zu diskutieren! und vielen dank für euern einsatz und das engagement.

grüsse aus der schweiz marcel

[Speedyletti]

Leider stehe ich schon wieder an

im internet explorer werden die check, - und radioboxen in der mitte und mit rahmen dargestellt, im firefox sind jetzt wenigstens mal die rahmen weg, jedoch bringe ich diese auch nicht nach links. wenn ich versuche den submit button nach rechts zu verschieben (unter die eingabefelder) geschieht auch nichts.

ich wollte das powermail "nur" nutzen, damit an den absender eine antwortmail generiert werden kann, da dies ja mit dem formmailer nicht geht.

ich sehe jetzt dann nur noch als einige lösung, dass ich das formular in eine tabelle rein haue, damit alles dort ist wo es sein soll, jedoch kann das auch nicht die lösung sein.

gibt es denn noch keine css vorlagen für das powermail welche eingesetzt werden können?

merci für eure tipps


Ansicht im Internet Explorer




Ansicht im Firefox




HTML Code

<div class="contentelement"> <div class="tx-powermail-pi1"> <div class="tx-powermail-pi1_formwrap tx-powermail-pi1_formwrap_8"> <form name="testformular" id="testformular" action="index.php?id=16&amp;tx_powermail_pi1[mailID]=8&amp;cHash=aba361147a" method="post" class="tx_powermail_pi1_form" enctype="multipart/form-data"> <fieldset class="tx-powermail-pi1_fieldset tx-powermail-pi1_fieldset_formular tx-powermail-pi1_fieldset_1" id="tx-powermail-pi1_fieldset_1"> <legend>Formular</legend> <div class="tx_powermail_pi1_fieldwrap_html tx_powermail_pi1_fieldwrap_html_text tx_powermail_pi1_fieldwrap_html_1"> <label for="uid1">Name:<span class="powermail_mandatory">*</span></label> <input type="text" name="tx_powermail_pi1[uid1]" value="" class="required powermail_testformular powermail_text powermail_uid1" id="uid1" /> </div> <div class="tx_powermail_pi1_fieldwrap_html tx_powermail_pi1_fieldwrap_html_text tx_powermail_pi1_fieldwrap_html_2"> <label for="uid2">Email:<span class="powermail_mandatory">*</span></label> <input type="text" name="tx_powermail_pi1[uid2]" value="" class="required validate-email powermail_testformular powermail_text powermail_uid2" id="uid2" /> </div> <div class="tx_powermail_pi1_fieldwrap_html tx_powermail_pi1_fieldwrap_html_select tx_powermail_pi1_fieldwrap_html_4"> <label for="uid4">Auswahlbox:</label> <div class="auswahlbox"> <select name="tx_powermail_pi1[uid4]" id="uid4" class="powermail_testformular powermail_select powermail_uid4" > <option value="bitte wählen Sie aus folgenden Möglichkeiten:">bitte wählen Sie aus folgenden Möglichkeiten:</option> <option value="1. Auswahl">1. Auswahl</option> <option value="2 Auswahl">2 Auswahl</option> <option value="3 Auswahl">3 Auswahl</option> <option value="4 Auswahl">4 Auswahl</option> <option value="5 Auswahl">5 Auswahl</option> </select> </div> </div> <div class="tx_powermail_pi1_fieldwrap_html tx_powermail_pi1_fieldwrap_html_check tx_powermail_pi1_fieldwrap_html_5"> <p class="tx_powermail_pi1_fieldwrap_html_checkbox_title">Checkbox:</p> <div class="checkbox"> <label for="uid5_0">1. Option</label> <input type="checkbox" name="tx_powermail_pi1[uid5][0]" value="1. Option" class="powermail_testformular powermail_check powermail_uid5 powermail_subuid5_0" id="uid5_0" /> </div> <div class="checkbox"> <label for="uid5_1">2. Option</label> <input type="checkbox" name="tx_powermail_pi1[uid5][1]" value="2. Option" class="powermail_testformular powermail_check powermail_uid5 powermail_subuid5_1" id="uid5_1" /> </div> <div class="checkbox"> <label for="uid5_2">3. Option</label> <input type="checkbox" name="tx_powermail_pi1[uid5][2]" value="3. Option" class="powermail_testformular powermail_check powermail_uid5 powermail_subuid5_2" id="uid5_2" /> </div> </div> <div class="tx_powermail_pi1_fieldwrap_html tx_powermail_pi1_fieldwrap_html_radio tx_powermail_pi1_fieldwrap_html_6"> <p class="tx_powermail_pi1_fieldwrap_html_radio_title">Radiobutton:</p> <div class="radiobutton"> <label for="uid6_0">1. Radiobutton</label> <input type="radio" name="tx_powermail_pi1[uid6]" value="1. Radiobutton" class="powermail_testformular powermail_radio powermail_uid6 powermail_subuid6_0" id="uid6_0" /> </div> <div class="radiobutton"> <label for="uid6_1">2. Radiobutton</label> <input type="radio" name="tx_powermail_pi1[uid6]" value="2. Radiobutton" class="powermail_testformular powermail_radio powermail_uid6 powermail_subuid6_1" id="uid6_1" /> </div> <div class="radiobutton"> <label for="uid6_2">3. Radiobutton</label> <input type="radio" name="tx_powermail_pi1[uid6]" value="3. Radiobutton" class="powermail_testformular powermail_radio powermail_uid6 powermail_subuid6_2" id="uid6_2" /> </div> </div> <div class="tx_powermail_pi1_fieldwrap_html tx_powermail_pi1_fieldwrap_html_file tx_powermail_pi1_fieldwrap_html_7"> <label for="uid7">Datei Upload:</label> <input type="file" name="tx_powermail_pi1[uid7]" class="powermail_testformular powermail_file powermail_uid7" id="uid7" /> </div> <div class="sendebutton"> <div class="tx_powermail_pi1_fieldwrap_html tx_powermail_pi1_fieldwrap_html_submit tx_powermail_pi1_fieldwrap_html_3"> <input type="submit" value="absenden" class="powermail_testformular powermail_submit powermail_submit_uid3" /> </div> </div> </fieldset> </form> <script type="text/javascript">
                function formCallback(result, form) {
                    window.status = "valiation callback for form '" + form.id + "': result = " + result;
                }
                var valid = new Validation('testformular', {immediate : true, onFormValidate : formCallback});
            </script> </div> </div> </div> </div>

CSS Code

/* POWERMAIL FORMULAR*/

/*Validation*/
input.validation-failed {
    background-color: #f2f2f2;
}
/*Validation*/
div.powermail_mandatory_js {
    color: #372D23;
    font-weight: normal;
}

/*LABEL = Beschriftung - ok */
fieldset label {
    display: block;
    width: 120px;
    float: left;
    clear: left;
}
/*Eingabefeld - ok */
fieldset input {
   display: block;
   width: 220px;
   border: 1px solid #999999;
   float: left;
}
/*Auswahlbox - ok */
fieldset select {
   display: block;
   width: 220px;
   float: left;
}
/*eigene class in tmpl_fieldwrap.html*/
.checkbox {
    clear: both;
    height: 5px;
}

.checkbox label{
    }
.tx_powermail_pi1_fieldwrap_html_checkbox_title {
    padding-top: 10px;
}
.radiobutton {
    clear: both;
    height: 5px;
}
.tx_powermail_pi1_fieldwrap_html_radio_title {
    padding-top: 10px;
}
tx_powermail_pi1_fieldwrap_html tx_powermail_pi1_fieldwrap_html_radio tx_powermail_pi1_fieldwrap_html_6 input {
    border-top-style: none;
    border-right-style: none;
    border-bottom-style: none;
    border-left-style: none;
}
.sendebutton {
    clear: both;
}
.auswahlbox option powermail_testformular powermail_select {
    padding-left: 120px;
}

/* Radio & Checkbok - clear: both */
.tx_powermail_pi1_fieldwrap_html_radio_title,
.tx_powermail_pi1_fieldwrap_html_checkbox_title {
    clear: both;
}
input.powermail_submit {
    border: 1px solid #999999;
    margin-top: 10px;
}