Du bist nicht angemeldet. Der Zugriff auf einige Boards wurde daher deaktiviert.
Seiten: 1
#1 11. Dezember 2012 15:04
- jester
- kennt CMS/ms
- Registriert: 10. Juni 2011
- Beiträge: 149
[GELÖST] Formbuilder: Stress mit IE9!
Hallo,
ich habe folgendes Problem:
Mit dem Formbuilder habe ich ein Kontaktformular erstellt, das in folgenden Browsern korrekt dargestellt wird:
Firefox 17
Opera 11.60
Chrome 23
Internet Explorer 8
Wer muss wieder aus der Reihe tanzen? Der Internet Explorer 9!
Alle stellen das Formular einspaltig dar, der IE9 fängt aber nach den Checkboxen und einem Dropdown-Auswahlfeld zweispaltig an und versetzt den Inhalt (siehe Screenshot).
Ich verwende nur das für die Farbgebung modifizierte mitgelieferte "FormBuilder Default Style".
Im Quelltext sind auch nur die "sauberen" DIVs zu sehen, keine zusätzlichen <br> oder so.
Ich hänge mal Screenshots zur Verdeutlichung an. Ich suche mir jetzt seit gestern eine Wolf und kann nicht herausfinden, woran das vielleicht liegt.
Darstellung im IE9
(sorry, leider etwas klein, ich musste einen Bekannten bitte, mir den Screenshot zu machen...)
Darstellung in Chrome23
Hier der Quelltext aus dem FormBuilder:
{* and now the form itself *} {$fb_form_start} <div>{$fb_hidden}</div> <div{if $css_class != ''} class="{$css_class}"{/if}> {if $total_pages gt 1}<span>{$title_page_x_of_y}</span>{/if} {foreach from=$fields item=entry} {if $entry->display == 1} {strip} {if $entry->needs_div == 1} <div {if $entry->required == 1 || $entry->css_class != '' || $entry->valid == 0} class=" {if $entry->required == 1}required{/if} {if $entry->css_class != ''} {$entry->css_class}{/if} {if $entry->valid == 0} fb_invalid{/if} " {/if} > {/if} {if $entry->hide_name == 0} <label{if $entry->multiple_parts != 1} for="{$entry->input_id}"{/if}>{$entry->name} {if $entry->required_symbol != ''} {$entry->required_symbol} {/if} </label> {/if} {if $entry->multiple_parts == 1} {section name=numloop loop=$entry->input} {if $entry->label_parts == 1} <div>{$entry->input[numloop]->input} {$entry->input[numloop]->name}</div> {else} {$entry->input[numloop]->input} {/if} {if isset($entry->input[numloop]->op) && $entry->input[numloop]->op}{$entry->input[numloop]->op}{/if} {/section} {else} {if $entry->smarty_eval == '1'}{eval var=$entry->input}{else}{$entry->input}{/if} {/if} {if $entry->helptext != ''} <a href="javascript:fbht('{$entry->field_helptext_id}')"><img src="modules/FormBuilder/images/info-small.gif" alt="Help" /></a> <span id="{$entry->field_helptext_id}" style="display:none" class="fbr_helptext">{$entry->helptext}</span>{/if} {if $entry->valid == 0} <--- {$entry->error}{/if} {if $entry->needs_div == 1} </div> {/if} {/strip} {/if} {/foreach} {if $has_captcha == 1} <div class="captcha">{$graphic_captcha}{$title_captcha}<br />{$input_captcha}</div>
Und hier die Ausgabe des Quelltextes im Browser:
[== HTML ==]
<div> <div><input type="checkbox" class="cms_checkbox" name="cntnt01fbrp__31[]" value="1" id="auswahl_kontakt_0" /> <label for="auswahl_kontakt_0">Ich möchte die Flowkur buchen</label></div> <div><input type="checkbox" class="cms_checkbox" name="cntnt01fbrp__31[]" value="2" id="auswahl_kontakt_1" /> <label for="auswahl_kontakt_1">Ich möchte gerne ein Beratungsgespräch</label></div> <div><input type="checkbox" class="cms_checkbox" name="cntnt01fbrp__31[]" value="3" id="auswahl_kontakt_2" /> <label for="auswahl_kontakt_2">Ich möchte gratis den Newsletter abonnieren</label></div> </div> <div class="required"> <label for="fbrp__32">Anrede*</label> <select class="cms_dropdown" name="cntnt01fbrp__32" id="fbrp__32"><option value="" selected="selected"> Anrede</option><option value="1">Herr</option><option value="2">Frau </option> </select> </div> <div class="required"> <label for="fbrp__33">Vorname*</label> <input type="text" name="cntnt01fbrp__33" value="" size="25" maxlength="40" id="fbrp__33" /> </div> <div class="required"><label for="fbrp__34">Nachname*</label> <input type="text" name="cntnt01fbrp__34" value="" size="25" maxlength="60" id="fbrp__34" /> </div> <div><label for="fbrp__35">Straße Nr.</label><input type="text" name="cntnt01fbrp__35" value="" size="25" maxlength="60" id="fbrp__35" /> </div> <div><label for="fbrp__36">PLZ</label><input type="text" name="cntnt01fbrp__36" value="" size="5" maxlength="5" id="fbrp__36" /> </div> <div><label for="fbrp__37">Ort</label><input type="text" name="cntnt01fbrp__37" value="" size="25" maxlength="60" id="fbrp__37" /> </div> <div><label for="fbrp__38">Land</label><input type="text" name="cntnt01fbrp__38" value="" size="25" maxlength="60" id="fbrp__38" /> </div> <div><label for="fbrp__39">Telefon</label><input type="text" name="cntnt01fbrp__39" value="" size="25" maxlength="60" id="fbrp__39" /> </div> <div class="required"><label for="fbrp__40">E-Mail*</label><input type="text" name="cntnt01fbrp__40" value="" size="25" maxlength="100" id="fbrp__40" /> </div> <div><label for="fbrp__41">Wie haben Sie von uns gehört?</label><textarea name="cntnt01fbrp__41" cols="50" rows="2" class="cms_textarea" id="fbrp__41"></textarea></div> <div><label for="fbrp__42">Platz für eine weitere Nachricht</label><textarea name="cntnt01fbrp__42" cols="50" rows="2" class="cms_textarea" id="fbrp__42"></textarea></div> <div class="captcha"><input type="hidden" name="hncaptcha" value="23311221131122113231231323231322"/> <input type="hidden" name="hncaptcha_public_key" value="37b83"/> <img class="captchapict" src="/tmp/cache/hn_captcha_37b83.jpg" width="198" height="72" alt="This is a captcha-picture. It is used to prevent mass-access by robots. (see: www.captcha.net)" title="">
Last but not least das nur für die Farbwerte modifizierte Standard-Stylesheet.
[== CSS ==]
/* Sample FormBuilder CSS base */ form {margin-top:0} form, td, th, li { font-size: 100%} form div {margin-bottom:0.5em} fieldset div { margin-bottom:0.5em; margin-left:1em; } fieldset div div { margin-top:0.5em; margin-left:1em } fieldset { margin-bottom:1em; border:1px solid #EB6702; padding:0.5em } fieldset label { width:auto; } legend { color:#FFF; background:#EB6702; font-style:italic; font-size:1.2em; margin-bottom:0.5em; padding:0.2em; width:auto; border:1px solid #CCC } textarea { margin: 0.5em 0; width:98%; height: 4em } /* Apply this class to text/select input fields with shorter labels to help alignment */ .short-label label {float:left; width:10em} .short-label fieldset div input, .short-label fieldset div select {width:16em} /* Pretty up your Captcha image output */ .captcha { margin:0.5em 0; width:200px; text-align:center } .captcha img {border:1px solid #F60; margin-bottom:0.5em} .captcha input {width:196px; margin-top:0.5em} /* Just a bit more room for the Submit button */ .submit {margin-top:1em} /* Apply this class to text/select input fields with shorter labels to help alignment */ .short-label label {float:left; width:10em} .short-label fieldset div input, .short-label fieldset div select {width:16em} /* Pretty up your Captcha image output */ .captcha { margin:0.5em 0; width:200px; text-align:center } .captcha img {border:1px solid #EB6702; margin-bottom:0.5em} .captcha input {width:196px; margin-top:0.5em} /* Just a bit more room for the Submit button */ .submit {margin-top:1em} .contactform input {border: 1px solid #EB6702;} .contactform input.checkbox {border: none;} .contactform label { display: block; float: left; width: 320px; } .contactform label.label { display: inline; float: none; width: 50px; font-size: 14px; } .contactform textarea { background-color: #ffc; border: 1px solid #EB6702; } .formbuilderform .message { line-height: 16px; padding: 0 0 8px 0; }
Sowas macht mich fertig ...
Offline
#2 11. Dezember 2012 16:07
- NaN
- Moderator
- Ort: Halle (Saale)
- Registriert: 09. November 2010
- Beiträge: 4.437
Re: [GELÖST] Formbuilder: Stress mit IE9!
Code im Forum einfügen:
http://www.cmsmadesimple.de/forum/viewt … 725#p12725
http://www.cmsmadesimple.de/forum/viewt … 400#p15400
http://www.cmsmadesimple.de/forum/viewt … 2875#p2875
http://www.cmsmadesimple.de/forum/viewt … 568#p15568
Das kann sonst leider keiner lesen.
Module: GBFilePicker, AdvancedContent
Sicherheit: Beispiel .htaccess-Datei
CMSms 1.12 unter PHP 7:
cmsms-1.12.3.zip (inoffiziell - komplett inkl. Installer)
CMSms 1.12 unter PHP 8:
cmsms-1.12.4.zip (inoffiziell - komplett inkl. Installer)
Offline
#3 11. Dezember 2012 18:44
- jester
- kennt CMS/ms
- Registriert: 10. Juni 2011
- Beiträge: 149
Re: [GELÖST] Formbuilder: Stress mit IE9!
Oh, sorry!
{* and now the form itself *}
{$fb_form_start}
<div>{$fb_hidden}</div>
<div{if $css_class != ''} class="{$css_class}"{/if}>
{if $total_pages gt 1}<span>{$title_page_x_of_y}</span>{/if}
{foreach from=$fields item=entry}
{if $entry->display == 1}
{strip}
{if $entry->needs_div == 1}
<div
{if $entry->required == 1 || $entry->css_class != '' || $entry->valid == 0} class="
{if $entry->required == 1}required{/if}
{if $entry->css_class != ''} {$entry->css_class}{/if}
{if $entry->valid == 0} fb_invalid{/if} "
{/if} >
{/if}
{if $entry->hide_name == 0}
<label{if $entry->multiple_parts != 1} for="{$entry->input_id}"{/if}>{$entry->name}
{if $entry->required_symbol != ''}
{$entry->required_symbol}
{/if}
</label>
{/if}
{if $entry->multiple_parts == 1}
{section name=numloop loop=$entry->input}
{if $entry->label_parts == 1}
<div>{$entry->input[numloop]->input} {$entry->input[numloop]->name}</div> {else}
{$entry->input[numloop]->input}
{/if}
{if isset($entry->input[numloop]->op) && $entry->input[numloop]->op}{$entry->input[numloop]->op}{/if}
{/section}
{else}
{if $entry->smarty_eval == '1'}{eval var=$entry->input}{else}{$entry->input}{/if}
{/if}
{if $entry->helptext != ''}
<a href="javascript:fbht('{$entry->field_helptext_id}')">
<img src="modules/FormBuilder/images/info-small.gif" alt="Help" /></a>
<span id="{$entry->field_helptext_id}" style="display:none" class="fbr_helptext">{$entry->helptext}</span>{/if}
{if $entry->valid == 0} <--- {$entry->error}{/if}
{if $entry->needs_div == 1}
</div>
{/if}
{/strip}
{/if} {/foreach} {if $has_captcha == 1}
<div class="captcha">{$graphic_captcha}{$title_captcha}
<br />{$input_captcha}
</div>
Besser so? Mit diesen ganzen verschachtelten ifs komme ich überhaupt nicht klar.
Offline
#4 11. Dezember 2012 18:51
- jester
- kennt CMS/ms
- Registriert: 10. Juni 2011
- Beiträge: 149
Re: [GELÖST] Formbuilder: Stress mit IE9!
Ausgabe des Quelltexts im Browser:
[== HTML ==]
<div>
<div>
<input type="checkbox" class="cms_checkbox" name="cntnt01fbrp__31[]" value="1" id="auswahl_kontakt_0" />
<label for="auswahl_kontakt_0">Ich möchte die Flowkur buchen</label>
</div>
<div>
<input type="checkbox" class="cms_checkbox" name="cntnt01fbrp__31[]" value="2" id="auswahl_kontakt_1" />
<label for="auswahl_kontakt_1">Ich möchte gerne ein Beratungsgespräch</label>
</div>
<div>
<input type="checkbox" class="cms_checkbox" name="cntnt01fbrp__31[]" value="3" id="auswahl_kontakt_2" />
<label for="auswahl_kontakt_2">Ich möchte gratis den Newsletter abonnieren</label>
</div>
</div>
<div class="required">
<label for="fbrp__32">Anrede*</label>
<select class="cms_dropdown" name="cntnt01fbrp__32" id="fbrp__32">
<option value="" selected="selected">
Anrede</option>
<option value="1">Herr</option>
<option value="2">Frau </option>
</select>
</div>
<div class="required">
<label for="fbrp__33">Vorname*</label>
<input type="text" name="cntnt01fbrp__33" value="" size="25" maxlength="40" id="fbrp__33" /> </div>
<div class="required"><label for="fbrp__34">Nachname*</label>
<input type="text" name="cntnt01fbrp__34" value="" size="25" maxlength="60" id="fbrp__34" /> </div>
<div>
<label for="fbrp__35">Straße Nr.</label>
<input type="text" name="cntnt01fbrp__35" value="" size="25" maxlength="60" id="fbrp__35" /> </div>
<div>
<label for="fbrp__36">PLZ</label>
<input type="text" name="cntnt01fbrp__36" value="" size="5" maxlength="5" id="fbrp__36" /> </div>
<div>
<label for="fbrp__37">Ort</label>
<input type="text" name="cntnt01fbrp__37" value="" size="25" maxlength="60" id="fbrp__37" /> </div>
<div>
<label for="fbrp__38">Land</label><input type="text" name="cntnt01fbrp__38" value="" size="25" maxlength="60" id="fbrp__38" />
</div>
<div>
<label for="fbrp__39">Telefon</label><input type="text" name="cntnt01fbrp__39" value="" size="25" maxlength="60" id="fbrp__39" />
</div>
<div class="required"><label for="fbrp__40">E-Mail*</label>
<input type="text" name="cntnt01fbrp__40" value="" size="25" maxlength="100" id="fbrp__40" /> </div>
<div>
<label for="fbrp__41">Wie haben Sie von uns gehört?</label>
<textarea name="cntnt01fbrp__41" cols="50" rows="2" class="cms_textarea" id="fbrp__41">
</textarea>
</div>
<div>
<label for="fbrp__42">Platz für eine weitere Nachricht</label><textarea name="cntnt01fbrp__42" cols="50" rows="2" class="cms_textarea" id="fbrp__42">
</textarea>
</div>
<div class="captcha"><input type="hidden" name="hncaptcha" value="23311221131122113231231323231322"/>
<input type="hidden" name="hncaptcha_public_key" value="37b83"/>
<img class="captchapict" src="/tmp/cache/hn_captcha_37b83.jpg" width="198" height="72" alt="This is a captcha-picture. It is used to prevent mass-access by robots. (see: www.captcha.net)" title="">
Offline
#5 11. Dezember 2012 18:54
- jester
- kennt CMS/ms
- Registriert: 10. Juni 2011
- Beiträge: 149
Re: [GELÖST] Formbuilder: Stress mit IE9!
Und hier noch das von mir modifizierte Standard-Stylesheet:
[== CSS ==]
/* Sample FormBuilder CSS base */
form {margin-top:0}
form, td, th, li { font-size: 100%}
form div {margin-bottom:0.5em}
fieldset div { margin-bottom:0.5em; margin-left:1em; }
fieldset div div { margin-top:0.5em; margin-left:1em }
fieldset { margin-bottom:1em; border:1px solid #EB6702; padding:0.5em }
fieldset label { width:auto; }
legend { color:#FFF; background:#EB6702; font-style:italic; font-size:1.2em; margin-bottom:0.5em; padding:0.2em; width:auto; border:1px solid #CCC }
textarea { margin: 0.5em 0; width:98%; height: 4em }
/* Apply this class to text/select input fields with shorter labels to help alignment */
.short-label label {float:left; width:10em}
.short-label fieldset div input,
.short-label fieldset div select {width:16em}
/* Pretty up your Captcha image output */
.captcha { margin:0.5em 0; width:200px; text-align:center }
.captcha img {border:1px solid #F60; margin-bottom:0.5em}
.captcha input {width:196px; margin-top:0.5em}
/* Just a bit more room for the Submit button */
.submit {margin-top:1em}
/* Apply this class to text/select input fields with shorter labels to help alignment */
.short-label label {float:left; width:10em}
.short-label fieldset div input,
.short-label fieldset div select {width:16em}
/* Pretty up your Captcha image output */
.captcha { margin:0.5em 0; width:200px; text-align:center }
.captcha img {border:1px solid #EB6702; margin-bottom:0.5em}
.captcha input {width:196px; margin-top:0.5em}
/* Just a bit more room for the Submit button */
.submit {margin-top:1em}
.contactform input {border: 1px solid #EB6702;}
.contactform input.checkbox {border: none;}
.contactform label { display: block; float: left; width: 320px; }
.contactform label.label { display: inline; float: none; width: 50px; font-size: 14px; }
.contactform textarea { background-color: #ffc; border: 1px solid #EB6702; }
.formbuilderform .message { line-height: 16px; padding: 0 0 8px 0; }
Offline
#6 11. Dezember 2012 21:48
- Janl
- Server-Pate
- Ort: Freistadt, Österreich
- Registriert: 13. Dezember 2010
- Beiträge: 1.231
- Webseite
Re: [GELÖST] Formbuilder: Stress mit IE9!
Es gibt in IE so ein compatibilitätsmodus, mal versucht?
mfg
Jan
Kubuntu 22.04 - Win 11 pro / Kubuntu 20.04 - win10 pro
Offline
#7 12. Dezember 2012 01:39
- Andynium
- Moderator
- Ort: Dohna / SN / Deutschland
- Registriert: 13. September 2010
- Beiträge: 7.018
- Webseite
Re: [GELÖST] Formbuilder: Stress mit IE9!
Es gibt in IE so ein compatibilitätsmodus
[== HTML ==]
<meta http-equiv="X-UA-Compatible" content="IE=EmulateIE8" >
Achtung! Muss als erster Eintrag im head-Bereich stehen.
Offline
#8 13. Dezember 2012 17:38
- jester
- kennt CMS/ms
- Registriert: 10. Juni 2011
- Beiträge: 149
Re: [GELÖST] Formbuilder: Stress mit IE9!
Das war's! Danke, cyberman!
[Woher weiß man sowas???]
Offline
#9 13. Dezember 2012 21:10
- nockenfell
- Moderator
- Ort: Gontenschwil, Schweiz
- Registriert: 09. November 2010
- Beiträge: 2.934
- Webseite
Re: [GELÖST] Formbuilder: Stress mit IE9!
[Woher weiß man sowas???]
Das weiss man ..... oder auch nicht.
http://acidmartin.wordpress.com/2009/03 … -meta-tag/
http://msdn.microsoft.com/en-us/library … 85%29.aspx
[dieser Beitrag wurde mit 100% recycled bits geschrieben]
Mein Blog / Diverse Links rund um CMS Made Simple
Module: btAdminer, ToolBox
Offline
#10 14. Dezember 2012 11:38
- Janl
- Server-Pate
- Ort: Freistadt, Österreich
- Registriert: 13. Dezember 2010
- Beiträge: 1.231
- Webseite
Re: [GELÖST] Formbuilder: Stress mit IE9!
Da zeigt diese 2. Link wie "standard-konform" IE ist.
Es ist unverständlich dass MS so etwas bastelt wenn man bedenkt dass die doch ebenso in das W3C vertreten sind.
Ach ja, es sei so.
Jan
Kubuntu 22.04 - Win 11 pro / Kubuntu 20.04 - win10 pro
Offline
Seiten: 1