Dyn. Formular V0.9.2 auf Adobe Spry Basis inkl. Captcha

[Thomas Steger]

Hallo yodatortenboxer,

ist technisch machbar, leider komme ich aber in den nächten Tagen bzw. Wochen nicht dazu.

Gruß yodatortenboxer

mach Dir keinen Stress, mir ist schon geholfen, wenn ich weiss, dass dieses Feature in naher Zukunft kommen kann. Dann kann ich die bereits eingesetzen Module lassen und muss mir nichts neues suchen...

Danke..

Thomas

[hohorstmann]

Guten Morgen zusammen,

4.8.11 / MySQL 5 / php5 / 1&1 / xtcDynSpryForm0.9.2

ich weiß, dass dieses Sahneschnittchen nur unter Contenido V.4.6.23 bis 4.8.6 "freigegeben" ist.
Das wäre doch sehr schön, wenn ich es auch unter 4.8.11 zum Laufen brächte.
Leider sieht mein Ergebnis so aus.
http://www.minerva-it.biz/xtcDynSpryForm0.9.2.pdf
Deshalb glaube ich, dass es vielleicht andere Probleme gibt als der Umstand "4.8.11".

Hat da jemand einen Tipp?

Gruß, Ho

[idea-tec]

grob ins blaue geschätzt würde ich mal meinen, dass da pfade nicht passen.

es funktioniert auch unter 4.8.11, referenz zu kleineren versionen habe ich keine.
was mir unter 4.8.11 aufgefallen ist, sind die meldungen mit dem falschen format, also den fehlermeldungen bei pflichtfeldern.

[yodatortenboxer]

Hiho,

Leider sieht mein Ergebnis so aus.
http://www.minerva-it.biz/xtcDynSpryForm0.9.2.pdf

Ich vermute auch das da die Pfade nicht stimmen. Klick da mal mit der rechten Maustaste auf drauf und dann auf Eigenschaften oder schau einmal im quelltext nach.
Normalerweise ist ja alles im Ordner xtcDynForm unter dem Mandantenordner, also beim Standartmandanten unter cms/xtcDynForm/. Da sind auch die Ordner und Dateien vom Javascript und dem CSS und das Modul nimmt alles aus diesen Ordnern und unterordnern.

Wenn du nun das Javascript zum Beispiel direkt unter cms/js/, das CSS unter cms/css usw. gelegt hast, musst du im Modul dementsprechend auch die Pfade anpassen.

Im Moduloutput kann man da ab Zeile 21 folgende Anpassungen machen:

Code: Alles auswählen

##########################################################################            
################## Verzeichnisse der benötigten Dateien ##################
##########################################################################  

$JsDir="xtcDynForm/js";
$CssDir="xtcDynForm/css";
$ImgDir="xtcDynForm/img";
// Pfad für PNGFIX am Ende mit /
// Pfad muss bei Pfadänderungen ebenfalls in der xtcDynForm/iepngfix/iepngfix.htc angepasst werden
$IEPNGFIXDir="xtcDynForm/iepngfix/";
// Pfad bei CaptchaDir änderungen muss auch in der datei xtcDynForm/captcha/captcha.php unter $ttf = $_SERVER['DOCUMENT_ROOT'] angepasst werden!!!
$CaptchaDir="xtcDynForm/captcha";
$ImgOkName="xtc-icon-ok.png";
$ImgNotOkName="xtc-icon-notok.png";

Gruß yodatortenboxer

[hohorstmann]

Hallo,

ja, da stimmten die Pfade nicht. Ich habe das Verzeichnis jetzt direkt unter cms gelegt, also: cms/xtcDynForm.
Das war ein guter Tip - jetzt läuft das "Sahneschnittchen" (fast).
Jetzt habe ich nun ein Problem mit der Anzeige des Sicherheitscodes, da wird nur ein Feld mit einem roten Kreuzchen angezeigt.
Nachdem ich die Maßnamen von cybil hier im Thread erfolglos durchgespielt habe, bin ich im Moment etwas ratlos.

Deshalb hier nochmal "mein" captcha.php

Code: Alles auswählen

<?php 
   session_start(); 
   //if(isset($_SESSION['captchaspam']) AND $_POST["sicherheitscode"] == $_SESSION['captchaspam']){
   unset($_SESSION['captchaspam']); 

   function randomString($len) { 
      function make_seed(){ 
         list($usec , $sec) = explode (' ', microtime()); 
         return (float) $sec + ((float) $usec * 100000); 
      } 
      srand(make_seed());  
      //Der String $possible enthält alle Zeichen, die verwendet werden sollen 
      $possible="ABCDEFGHJKLMNPRSTUVWXYZabcdefghijkmnpqrstuvwxyz23456789"; 
      $str=""; 
      while(strlen($str)<$len) { 
        $str.=substr($possible,(rand()%(strlen($possible))),1); 
      } 
   return($str); 
   } 

   $text = randomString(5);  //Die Zahl bestimmt die Anzahl stellen 
   $_SESSION['captchaspam'] = $text; 
          
   header('Content-type: image/png'); 
   $img = ImageCreateFromPNG('captcha.PNG'); //Backgroundimage 
   $color = ImageColorAllocate($img, 125, 125, 125); //Farbe 
   $ttf = $_SERVER['DOCUMENT_ROOT']."/xtcDynForm/captcha/Anorexia.ttf";  //Schriftart
   $ttfsize = 20; //Schriftgrösse 
   $angle = rand(0,5); 
   $t_x = rand(5,30); 
   $t_y = 35; 
   imagettftext($img, $ttfsize, $angle, $t_x, $t_y, $color, $ttf, $text); 
   imagepng($img); 
   imagedestroy($img);
   //}else{
   //die ("Der Sicherheitscode ist falsch!");
   //}
?> 

Bei allen Varianten und auch weiteren Versuchen meinerseits bleibt das rote Kreuzchen.
Ich denke es liegt ann der Pfadeinstellung - ich bin da wohl heute ohne Lesebrille, oder was?

[yodatortenboxer]

Hiho,

wie ist die Verzeichnisstrucktur?
Wo genau liegt das captcha verzeichnis?

Gruß yodatortenboxer

[hohorstmann]

Hallo Yodatortenboxer,
http://www.minerva-it.biz/2009/cms/xtcDynForm/captcha - ebenda css, iepngfix, img und js.
Hilft das ?
Gruß,Ho

[yodatortenboxer]

Hallo,

Schau einmal ob du vieleicht ein Leerzeichen hinter dem ?> hast und wenn entferne es einmal.
Ansonsten kann ich dir nur anbieten das du mir einmal einen FTP-Zugang für das captcha Verzeichnis zukommen lässt und dann schau ich mal genauer nach.
Beim Aufruf von
http://minerva-it.biz/2009/cms/xtcDynFo ... aptcha.php
müsste eigentlich zumindest das selbe wie hier zu sehen sein:
http://minerva-it.biz/2009/cms/xtcDynFo ... aptcha.PNG
aber es kommt eine Fehlermeldung. Da muss also irgendwo ein Fehler beim generieren des Bildes sein.

gruß yodatortenboxer

[yodatortenboxer]

Hallo,

es funktioniert nun wie man hier sehen kann:
http://minerva-it.biz/2009/cms/xtcDynFo ... aptcha.php

Es lag an der Pfadangabe. In Zeile 27 stand bei dir:

Code: Alles auswählen

$ttf = $_SERVER['DOCUMENT_ROOT']."/xtcDynForm/captcha/Anorexia.ttf"; //Schriftart

und dies erzeugte beim Pfad die Fehlermeldung da der erstellte Pfad dann so aussah (wichtige Daten habe ich hier wegen der Sicherheit mit einem x ausgetauscht):

/kunden/homepages/x/xxxxxxxxxx/htdocs/xtcDynForm/captcha/Anorexia.ttf

Richtig war in hier, da du ja deine Contenidoinstallation in einem Unterverzeichnis namens 2009 hast folgendes:

Code: Alles auswählen

$ttf = $_SERVER['DOCUMENT_ROOT']."/2009/cms/xtcDynForm/captcha/Anorexia.ttf"; //Schriftart

das erzeugt dann den richtigen Pfad wo die Dateien liegen wie folgt:

/kunden/homepages/x/xxxxxxxxxx/htdocs/2009/cms/xtcDynForm/captcha/Anorexia.ttf

gruß yodatortenboxer

[hohorstmann]

Frühen Dank,
jetzt läuft alles. Danke für Dein Hilfe.
Gruß, Ho

[thanatos]

Moin moin Community, moin moin yodatortenboxer,

das Modul läuft bei mir sehr gut, was die Funktionalität angeht. Leider habe ich ein Problem mit dem Layout, was ich trotz intensiven Ausprobierens nicht gelöst bekomme. Ich dachte bisher, dass ich mich mit CSS eigentlich halbwegs passabel auskenne, aber dieser Fehler verweist mich eindeutig in meine Schranken.

Das Formular binde ich ganz normal über ein Template in meinen Inhaltsbereich ein, lege einen Artikel an, konfiguriere das Modul entsprechend meiner Anforderungen an das Formular und speichere den ganzen Kram ab. Dann wird das Formular auch eingebunden, allerdings habe ich zwischen dem Beginn des div-Containers #SpryContactForm und dem ersten Formularfeld einen großen Abstand ohne Inhalt.

Das ganze könnt ihr euch hier anschauen: http://www.mosaik-is.de/testserver/kontakt/kontakt.html. Der Fehler tritt mit den Browsern FireFox 3, Opera 9 und Konqueror 4 auf. Im (unter Linux Ubuntu simulierten) Internet Explorer 6 ist der Abstand übrigens nicht da.

Wenn ich in der example.css im Eintrag #SpryContactForm ul li den Wert clear:both weglasse, dann verschwindet der Abstand, allerdings wird dann die Radiobutton-Gruppe nicht mehr korrekt dargestellt. Genauer gesagt: Die nächste Texteingabefelder werden nicht darunter sondern daneben angezeigt. Lasse ich den Wert clear:both drin, werden die folgenden Felder richtig positioniert, aber der große Abstand ist wieder da. (Das lässt sich prima über das Firefox-Addon FireBug simulieren. Zwischen der Simulation und der tatsächlichen Veränderung in der Datei habe ich keinen Unterschied feststellen können.)

Wie gesagt: Ich bin inzwischen echt verzweifelt, weil ich dem Problem nicht auf die Spur komme. Ich habe alle vererbten Werte über FireBug analysiert und nichts gefunden, was den Abstand verursachen könnte.

Die example.css befindet sich inzwischen fast wieder im Originalzustand, nachdem ich durch diverse Wertveränderungen keine Lösung gefunden habe:

Code: Alles auswählen

#SpryContactForm { 
  padding:5px;
  margin:10px 0 0;
  border:1px solid #e85d10;
}
span.contactFormSubmit input.resetbutton,span.contactFormSubmit input.submitbutton{
    background:#ffffff;
    color:#000000;
    border: 1px solid #e85d10;
}
span.contactFormSubmit input.submitbutton{
    margin-left:60px;
}
#SpryContactForm ul {
  list-style:none;
  margin:0;
  padding:0;
}

#SpryContactForm select, #SpryContactForm input[type="text"]{
    width:180px;
}

#SpryContactForm textarea{
    height:150px;
    width:250px;
}
#SpryContactForm ul li{
    height:30px;
    clear:both;
}
#SpryContactForm ul li.textarea{
    height:180px;
}
#SpryContactForm label{
    display:block;
    float:left;
    width:130px;
}
.validMsg, .novalidMsg{
    position:relative;
    top:2px;
    padding: 0px 3px;
    width:16px;
    height:16px;
    display:none;
}
.validMsg{
    display:none;
}
.radioValidState .validMsg,
.checkboxValidState .validMsg,
.textfieldValidState .validMsg, 
.textareaValidState .validMsg, 
.selectValidState .validMsg{
    display:inline;
}

.checkboxMaxSelectionsState .novalidMsg,
.checkboxMinSelectionsState .novalidMsg,
.radioRequiredState .novalidMsg,
.checkboxRequiredState .novalidMsg,
.textfieldRequiredState .novalidMsg,
.textareaRequiredState  .novalidMsg,
.textfieldInvalidFormatState .novalidMsg , 
.textfieldMinCharsState .novalidMsg, 
.textfieldMaxCharsState .novalidMsg , 
.textareaMinCharsState .novalidMsg , 
.textareaMaxCharsState .novalidMsg, 
.selectRequiredState .novalidMsg{
    display:inline;
}
span.textareaRequiredMsg,span.textareaMinCharsMsg,span.textareaMaxCharsMsg{
	position:relative;
	left:131px;
}
#Counterror_mess{
    padding:0px 5px;
}
#SpryContactForm ul li.grpradio{
	height:auto;
}
#SpryContactForm ul li span span.grpradio{
	display:block;
	width:70px;
	height:25px;
	float:left;
}
#SpryContactForm ul li.grpcheckbox{
	height:auto;
}
#SpryContactForm ul li span span.grpcheckbox{
	display:block;
	width:100px;
	height:25px;
	float:left;
}
#SpryContactForm ul li.text , #SpryContactForm ul li.headline{
	height:auto;
	padding-bottom:10px;
	width:500px;
}
br.clear{
	clear:both;
}

Meine format.php, in der sämtliche css-Formate für das contenido Frontend hinterlegt sind, schaut so aus:

Code: Alles auswählen

/***********************************************
* Cascading Style Sheet Definitions
* 
* Contenido 4.8.8
* Mandant Höhne Wärmesysteme
*
* Author      :     Lennart Brand
* Copyright   :     mosaik | individual service
* Mail        :     info@mosaik-is.de
* Created     :     06-11-2008
*
************************************************/


* {
  font-family:Arial, Tahoma, Verdana, sans-serif;
  color:#000000;
  margin:0;
  padding:0;
}

html, body {
  height:95%;
}

html {
  font-size:<?php print($fontsize); ?>%;
}

/*****************************************************************************/
/********************************* STRUCTURE *********************************/
/*****************************************************************************/

/********************************* CONTAINER *********************************/

#outerwrap { /* centers whole content in browser */
  margin:0 auto;
  width:930px;
}

#innerwrap { /* creates frame around content */
  width:928px;
  border:1px solid #e85d10;
  background-image:url('../images/navigation.png');
  background-position:left bottom;
  background-repeat:no-repeat;
  position:relative;
  top:10px;
}

#title {
  width:928px;
  height:135px;
  background-image:url('../images/title.png');
  background-position:left top;
  background-repeat:no-repeat;
}

.maintitle {
  float:left;
  color:#df001a;
  font-size:18pt;
  letter-spacing:3.7pt;
  line-height:18pt;
  font-weight:bold;
  position:absolute;
  left:310px;
  top:30px;
}

.subtitle {
  float:left;
  color:#00519e;
  font-style:italic;
  font-weight:normal;
  font-size:12pt;
  font-weight:bold;
  letter-spacing:0.1pt;
  position:absolute;
  left:310px;
  top:80px;
}

#breadcrumbs {
  float:left;
  font-size:9pt;
  position:absolute;
  top:115px;
  left:75px;
}

#navigation {
  float:left;
  width:195px;
  padding:10px 10px 180px;
}

#search {
  width:195px;
  margin-top:10px;
}

#content {
  margin-left:215px;
  width:670px;
  padding:10px 15px 20px;
  border-left:1px solid #e85d10;
}

#footer {
  clear: both;
  text-align:center;
  padding-top:4px;
  font-size:9pt;
  width:928px;
  height:20px;
  border-top:1px solid #e85d10;
  border-bottom:1px solid #e85d10;
  background-image:url('../images/footer.png');
  background-position:right center;
  background-repeat:no-repeat;
  background-color:#ffffff;
}

#addnavi { /* adds barrierfree and print navigation below title */
  float:right;
  position:absolute;
  top:115px;
  right:0px;
}

#bfnavi, #pdf {
  float:left;
  font-size:9pt;
  margin:0 15px 0 0;
}

#copyright {
  width:928px;
  text-align:center;
}

#copyright strong {
  color:#bbbbbb;
  font-size:7pt;
  font-weight:normal;
}

/********************************* MAIN NAVIGATION *********************************/

#navigation ul, #footer ul, #breadcrumbs ul {
  list-style-type:none;
  color:#e85d10;
}

#navigation li {
  font-size:11pt;
  border-top:1px solid #e85d10;
}

ul.mainNavigation {
  border-bottom:1px solid #e85d10;
}

#navigation h3 {
  color:#fdc400;
  letter-spacing:2.5pt;
  font-size:11pt;
  height:22px;
  margin:5px 0 0;
  padding:0 0 0 5px;
}

#navigation a {
  font-size:10pt;
  display:block;
  padding-top:8px;
  height:22px;
  text-decoration:none;
  color:#e85d10;
  font-weight:bold;
}

a.mainNavigation:hover {
  background-color:#FFDDAA;
  color:#ff0000;
}

a.subNavigation:hover {
  background-color:#FCE9CC;
  color:#ff0000;
}

a.subSubNavigation:hover {
  background-color:#FDECDD;
  color:#ff0000;
}

a.mainNavigation {
  width:190px;
  padding-left:5px;
}

a.subNavigation {
  padding-left:15px;
  width:180px;
  background-image:url('../images/sitemaplist.png');
  background-repeat:no-repeat;
  background-position:4px 12px;
}

a.subSubNavigation {
  padding-left:25px;
  width:170px;
  background-image:url('../images/sitemaplist.png');
  background-repeat:no-repeat;
  background-position:14px 12px;
}

/********************************* SEARCH INPUT *********************************/

#searchterm {
  font-size:100%;
  font-style:italic;  
  width:170px;

  border:1px solid #e85d10;

	color:#e85d10;
}

#search_send {
  width:16px;
  height:16px;
}

/********************************* SEARCH OUTPUT *********************************/

ul.searchResultItem {
  list-style-type:none;
  margin-bottom:20px;
}

li.searchResultHeader {
  font-weight:bold;
}

li.searchResultLink {
  font-size:80%;
}

li.searchResultEntry {
  margin:5px 0 5px 15pt;
}

p.result {
  text-align:center;
  margin-bottom:10px;
}

.searchResultItem strong {
  font-style:italic;
  font-weight:bold;
  color:#e85d10;
}

.result strong {
  font-weight:bold;
}

/********************************* FOOTER NAVIGATION *********************************/

#footer li {
  display:inline;
  color:#e85d10;
  padding:0;
  margin:0;
}

#footer a {
  padding:0 3px;
  text-decoration:none;
  color:#e85d10;
}

#footer a:hover {
  color:#ff0000;
  text-decoration:underline;
}

/********************************* BREADCRUMBS *********************************/

#breadcrumbs h3 {
  font-size:9pt;
  display:inline;
  color:#fdc400;
}

#breadcrumbs ul {
  display:inline;
}

#breadcrumbs li {
  display:inline;
  padding:0;
  margin:0;
}

#breadcrumbs a, #breadcrumbs a:active, #breadcrumbs a:visited {
  font-size:9pt;
  padding:0 3px;
  text-decoration:none;
  color:#e85d10;
}

#breadcrumbs a:hover {
  color:#ff0000;
  text-decoration:underline;
}

/********************************* BARRIERFREE & PRINT *********************************/

#bfnavi h3, #pdf h3 {
  font-size:9pt;
  display:inline;
  color:#e85d10;
}

#bfnavi ul, #pdf ul {
  display:inline;
}

#bfnavi li, #pdf li {
  display:inline;
  padding:0;
  margin:0 5px;
}

#bfnavi img, #pdf img {
  border:none;
  vertical-align:bottom;
  height:16px;
  width:16px;
}

/********************************* SITEMAP *********************************/

#sitemap, #sitemap ul {
  list-style-type:none;
  list-style-image:url('../images/none.png');
  margin-bottom:1.0em;
  color:#e85d10;
}

#sitemap li {
  margin:2px 0;
}

#sitemap a{
  font-size:100%;
  display:block;
  padding-top:0.4em;
  height:1.5em;
  text-decoration:none;
  color:#e85d10;
}

#sitemap a:hover {
  color:#ff0000;
  text-decoration:underline;
}

.level1 a {
  padding-left:50px;
  width:545px;
  background-color:#FFDDAA;
}

.level2 a {
  margin-left:20px;
  padding-left:90px;
  width:465px;
  background-image:url('../images/sitemaplist.png');
  background-repeat:no-repeat;
  background-position:55px 12px;
  background-color:#FCE9CC;
}

.level3 a {
  margin-left:40px;
  padding-left:130px;
  width:385px;
  background-image:url('../images/sitemaplist.png');
  background-repeat:no-repeat;
  background-position:75px 12px;
  background-color:#FDECDD;
}


/********************************* CONTENT STYLE *********************************/

/**************** HEADLINES, PARAGRAPHS & LINKS ****************/

h1 {
  color:#e85d10;
  letter-spacing:0.1em;
  font-size:120%;
  margin:0 0 1.0em;
  padding:0;
}

h2 {
  color:#e85d10;
  font-size:100%;
  font-weight:bold;
  margin:0 0 0.75em;
  padding:0;
}

h3 {
  color:#e85d10;
  font-size:100%;
  font-weight:normal;
  margin:0 0 0.75em;
  padding:0;
}

p, strong, address {
  line-height:1.3em;
  font-weight:normal;
  text-align:justify;
  margin:0;
  padding:0;
}

a {
  color:#e85d10;
  text-decoration:underline;
}

a:hover {
  text-decoration:none;
}

a.externerlink:before {
  content:url(../images/linkextern.png)" ";
}


/**************** TABLES ****************/

table {
  border:1px solid #e85d10;
  border-collapse:collapse; 
  border-spacing:0;
}

td, th {
  padding:5px;
  border:1px solid #e85d10;
}

/**************** LISTS (OL & UL) ****************/

.textItem ul {
  list-style-position:outside;
  list-style-type:none;
  padding:0;
  margin:0;
}

.textItem ul li {
  background-image:url('../images/contentlist1.png');
  background-position:left 0.7em;
  background-repeat:no-repeat;
  padding-left:20px;
  margin:0;
}

.textItem ul ul li {
  background-image:url('../images/contentlist2.png');
}

.textItem ul ul ul li {
  background-image:url('../images/contentlist3.png');
}

.textItem li {
  line-height:1.75em;
  text-align:justify;
}

.textItem ol {
  list-style-position:inside;
  margin:0;
  padding:0;
}

.textItem ol ol, .textItem ol ol ol {
  margin-left:1.2em;
}

/**************** CONTACT FORM ****************/

/* see files: xtcDynForm/css/....css */

/**************** SPECIAL FORMATS ****************/

.bildlinks {
  float:left;
  margin-right:1.0em;
}

.bildrechts {
  float:right;
  margin-left:1.0em;
}

.fetteschrift {
  font-weight:bold;
}

blockquote {
  padding:5px 10px 5px 35px;
  margin:0 0 1.0em;
  border:1px dashed #e85d10;
  background-image:url('../images/quotes.png');
  background-position:left top;
  background-repeat:no-repeat;
}

cite, acronym, abbr {
  border-bottom:1px dashed #e85d10;
  cursor:help;
}

cite {
  font-size:0.8em;
  font-style:italic;
}

hr {
  margin:0 auto;
  color:#e85d10;
}

pre {
  padding-left:30px;
  font-family:'Courier New', Courier, serif;
}

(Die PHP-Bereiche kommen daher, dass ich auf der Webseite ein Modul eingebunden habe, mit dem der Benutzer die Schriftgröße verändern kann.)

Ich würd mich wirklich sehr freuen, wenn jemand mich mit der Nase auf des Übels Wurzel stoßen könnte

Beste Grüße
Thanatos

[idea-tec]

example.css -> Zeile 20:

• #SpryContactForm input[type="text"] {

Kenne ich das irgendwie nicht? War der Meinung ich kenne CSS, aber das ist mir fremd

der Unterschied ist in der Vergabe einer Klasse für li.
Du solltest mal mit diesen beiden Klassen rumspielen, ich würde mit der oberen beginnen und die Höhe mal fixen, nur um zu sehen was passiert, oder auch einfach mal ein border drauf legen, damit man sieht wie groß es wirklich ist:

Code: Alles auswählen

#SpryContactForm ul li.grpradio{
   height:auto;
}
#SpryContactForm ul li span span.grpradio{
   display:block;
   width:70px;
   height:25px;
   float:left;
}

[yodatortenboxer]

Hallo,

das Modul läuft bei mir sehr gut, was die Funktionalität angeht. Leider habe ich ein Problem mit dem Layout, was ich trotz intensiven Ausprobierens nicht gelöst bekomme. Ich dachte bisher, dass ich mich mit CSS eigentlich halbwegs passabel auskenne, aber dieser Fehler verweist mich eindeutig in meine Schranken.

Kennst du Firebug für den Firefox? http://getfirebug.com/ Ein absolut klasse Plugin um eben solche Probleme zu finden und zu lösen.
Damit kan man wunderbar sehen welche Styles wo wirken bzw. womit sie überschrieben werden.
Außerdem kann man damit vorhandene Styles ändern/hinzufügen und den Effekt direkt im Browser darüber sehen.
WICHTIG! Firebug speichert keinerlei CSS irgendwo ab sondern manipuliert nur die Browseranzeige.
Also wenn die Einstellungen dann passen, müssen die so in das vorhandene CSS-File übernommen werden.

allerdings habe ich zwischen dem Beginn des div-Containers #SpryContactForm und dem ersten Formularfeld einen großen Abstand ohne Inhalt.

Es liegt meiner Meinung nach an der Layoutumsetzung. Der Abstand des Formulars wird durch die definition des <div id="navigation"> beinflusst.
Nimmt man aus dem CSS #navigation das float und das padding raus rutscht das formular wieder nach oben wobei dann natürlich dein Layout nicht mehr stimmt.

* #SpryContactForm input[type="text"] {

Kenne ich das irgendwie nicht? War der Meinung ich kenne CSS, aber das ist mir fremd

Das sind spezielle CSS-Attribut Selectoren. imput[type=text] bedeutet die Anwendung auf alle <input type="text"....
Das kann auch anders verwendet werden wie zum Beispiel a[title="textseite"] { background-color:#900; color:#FFF; }
funktioniert dann bei einem <a href="xxx" title="textseite">.
Beispiele findet man unter anderem auch hier: http://www.kollermedia.at/wp-content/th ... amples.php

gruß yodatortenboxer

[thanatos]

Moin yodatortenboxer,

Kennst du Firebug für den Firefox? http://getfirebug.com/ Ein absolut klasse Plugin um eben solche Probleme zu finden und zu lösen.
Damit kan man wunderbar sehen welche Styles wo wirken bzw. womit sie überschrieben werden.

Jup, kenne ich. Hab ich auch verwendet, siehe:

(Das lässt sich prima über das Firefox-Addon FireBug simulieren. Zwischen der Simulation und der tatsächlichen Veränderung in der Datei habe ich keinen Unterschied feststellen können.) [...] Wie gesagt: Ich bin inzwischen echt verzweifelt, weil ich dem Problem nicht auf die Spur komme. Ich habe alle vererbten Werte über FireBug analysiert und nichts gefunden, was den Abstand verursachen könnte.

allerdings habe ich zwischen dem Beginn des div-Containers #SpryContactForm und dem ersten Formularfeld einen großen Abstand ohne Inhalt.

Es liegt meiner Meinung nach an der Layoutumsetzung. Der Abstand des Formulars wird durch die definition des <div id="navigation"> beinflusst.
Nimmt man aus dem CSS #navigation das float und das padding raus rutscht das formular wieder nach oben wobei dann natürlich dein Layout nicht mehr stimmt.

Ohhhh man, ich glaub das nicht Das war genau das mit-der-Nase-draufstoßen, das ich gebraucht hab. Ich hab zwar gesehen, dass das Formular horizontal gesehen unter der Navi lag, aber ich konnte mir das nicht erklären. Tja, und jetzt wo du deinen Verdacht auch auf die Navi gelegt hast, hab ich noch mal alles nachgesehen und festgestellt: Ich hab bei nem Backup die alte .css Datei hochgeladen. In der aktuellsten Version hatte der #content-Container ein float:right;, in der aktiven Version fehlt das. Klar, dass dann ein clear:both; das Layout zerschießt. Bei #content einfach float:right; rein, margin-left: raus und weg ist der Abstand.

Danke für den zündenden Funken und natürlich auch Danke für das prima Modul!

Greetz
Than

[andrej]

Hallo, ist ein super modul. nutze es selbst, mich stört jedoch nur eines. die groß und kleinschreibung. wäre es möglich dieses modul als eine kleinschreibung version zu erhalten? ich meine damit die zuweisungen von klassen, id`s, dateinamen, ordnernamen, ausgabebereich des moduls. valide ist es leider auch nicht, wobei das die kleine schwierigkeit wäre das ganze zu korrigieren. ich weis nicht wie es bei euch ist, aber mein linux wird mit großenbuchstaben im dateisystem und klassen, idnamen nicht warm. zum teil sind die bezeichnungen der klassen total verwirrend, ohne dokumentation zumindest.

bzw. gibt es ein programm, mit dem ich alle buchstaben die groß sind in kleine buchstaben umbenennen kann?