CSS Tabellenbreite in CSS verändern?

F!o

Admiral
Registriert
Okt. 2004
Beiträge
7.495
Hi,

Ich habe eine CM Simple Seite wo ich mit einem Plugin ein Kontaktformular eingebunden habe.
Leider ist das Textfeld des Formulars so breit das es das Design sprengt.

Ich kann das Plugin verändern, und habe dazu eine Stylesheet datei die ich bearbeiten kann.

Kann mir einer erklären was ich abändern muss damit ich die Tabellenbreite festlegen kann?

Flo

Code:
.contactusframe {
  border:              solid 1px #c0c0c0;
  padding:             4px;
}
.contactus {
  border:              none;
  padding:             4px;
}
.contactus td {
  color:               black;
  font-weight:         normale;
}
.contactus td .text, .contactus td .text {
  border:              1px inset #c0c0c0;
  background-color:    white;
}
.contactus td .submit {
  border:              1px outset #808080;
  background-color:    white;
  padding:             0px;
  padding-left:        6px;
  padding-right:       6px;
}
.contactuslink {
}
.error {
  color: red;
}
 
Mit dem Stylesheet wird das etwas haarig - du solltest stattdessen vlt. das Plugin selbst bearbeiten. Du hast ja neben dem Stylesheet noch die eigentliche Datei des Plugins (vmtl. eine PHP-Datei oder so) bekommen - wenn du die hier hochlädst kann man dir sehr viel schneller helfen.
 
Hi,

Sorry, wusste ich nicht.
Der Code ist aus der index.php des Plugins

PHP:
<?
/*
    CMSimple Plugin - contactus version 2.2
    written by Carsten Heinelt - http://cmsimple.heinelt.eu

    Changes:
    v2.2 31-January-2007:
    - added dutch translation (Eric en Truus Lotgerink)
    - added slovak translation (Martin Sereday)
    - url encoding of page names corrected
    - updated contact us form layout and associated stylesheet
    v2.1 29-January-2007:
    - updated captcha version to be used
    - removed captcha code in error message
    - enhanced captcha functionality:
      - none
      - image: an image with a captcha code is shown
      - formula: a text formula is shown to be calculated by the user
    - call of generateCaptchaImage() updated in respect to changed arguments
    - call of getCaptchaHtml() updated in respect to changed arguments
    - changed configuration codes for better grouping in plugin loader
    v2.0 23-January-2007:
    - adapted to work with register plugin v2.0 and later, i.e. following
      variables are now used:
      $_SESSION['email'], $_SESSION['fullname'], $_SESSION['sessionnr'], 
      $_SESSION['username']
    - corrected missing text of send button
    v1.1 19-January-2007:
    - corrected expected captcha.inc file version
    v1.0 18-January-2007:
    - initial version: moved out of register plugin
    - top level function is contactuslink()
    - needs setting of folling session variables set by memberpages and register
      plugin:
      $_SESSION['Email'], $_SESSION['FullName'], $_SESSION['sessionnr'], 
      $_SESSION['accesslevel'] and $_SESSION['Name']
    
*/

/****************************************************************************
 *    Direct Calls                                                            *
 ****************************************************************************/

// Start session unless a robot is accessing the page
if (eregi("Googlebot",$_SERVER['HTTP_USER_AGENT']));
else if (eregi("MSNbot",$_SERVER['HTTP_USER_AGENT']));
else if (eregi("slurp",$_SERVER['HTTP_USER_AGENT']));
else if(session_id() == "") 
  session_start();

$plugin = basename(dirname(__FILE__),"/");

// Set default language and config and language definition files to load
if(!isset($sl))
  $sl = $cf['language']['default'];
$pth['file']['plugins_language'] = $pth['folder']['plugins'] . $plugin . 
  '/languages/' . $sl . '.php';
$pth['file']['plugins_config']   = $pth['folder']['plugins'] . $plugin . 
  '/config/config.php';

// Load language and configuration file
if(!@include($pth['file']['plugins_language']))
  die('Plugin Language file ' . $pth['file']['plugins_language'] . ' missing');
if(!@include($pth['file']['plugins_config']))
  die('Plugin config file ' . $pth['file']['plugins_config'] . ' missing');

if(!defined('CAPTCHA_LOADED')) {
  $captchaInclude = $pth['folder']['plugins'] . $plugin . "/captcha.inc";
  if(!@include($captchaInclude))
    die('Captcha functions file ' . $captchaInclude . ' missing');
  if(CAPTCHA_LOADED != '1.2')
    die('Captcha functions already loaded, but of wrong version ' . CAPTCHA_LOADED);
}

// Handling of Captcha Image Generation
if(isset($_GET['action'])){
  if($_GET['action'] == 'contactus_captcha' &&
      isset($_GET['captcha']) && 
      isset($_GET['ip'])) {
    $fontFolder = $pth['folder']['plugins'] . $plugin . '/font/';
    generateCaptchaImage($_GET['captcha'],
      (int)$plugin_cf[$plugin]['captcha_image_width'],
      (int)$plugin_cf[$plugin]['captcha_image_height'],
      (int)$plugin_cf[$plugin]['captcha_chars'],
      $fontFolder . $plugin_cf[$plugin]['captcha_font'],
      $plugin_cf[$plugin]['captcha_crypt']);
  }
}

// Handling of contact us email page
if(!($edit&&$adm) && isset($su)) {
  if(urldecode($su) == html_entity_decode(preg_replace("/ /", "_", $plugin_tx[$plugin]['contact_us']))) {
    $title = $plugin_tx[$plugin]['contact_us'];
    $o .= "<h1>" . $plugin_tx[$plugin]['contact_us'] . "</h1>\n";
    $o .= contactUs();
  }
}

/****************************************************************************
 *    Function Definitions                                                    *
 ****************************************************************************/
/*
 *  Create HTML contact us email form.
 */
function contactUsEmailForm($mode, $code, $name, $email, $subject, $content) {
  GLOBAL $plugin_tx,$plugin_cf,$PHP_SELF;
  $plugin = basename(dirname(__FILE__),"/");

  $o = 
    "<fieldset class=\"contactusframe\">\n" .
    "<legend>" . $plugin_tx[$plugin]['contact_us'] . "</legend>\n" .
    '<table class="contactus">' . "\n" .
    '<form method="post" action="' . $PHP_SELF . '" target="_self">' .
    '<input type="hidden" name="action" value="contact_us">' . "\n";
  if($mode == "logged_in") {
    $o .=
      '<input type="hidden" name="name" value="' . $name . '">' . "\n" .
      '<input type="hidden" name="email" value="' . $email . '">' . "\n";
  } else {
    $o .=
      '<input type="hidden" name="captcha" value="' . 
        md5_encrypt($code, $plugin_cf[$plugin]['captcha_crypt']) . '">' . "\n".
      '<tr>' . "\n". 
      '  <td>' . $plugin_tx[$plugin]['name'] . '</td>' . "\n".
      '  <td colspan="2"><input class="text" name="name" type="text" size="50" value="' . $name . '"></td>' . "\n".
      '</tr>' . "\n" .
      '<tr>' . "\n".
      '  <td>' . $plugin_tx[$plugin]['email'] . '</td>' . "\n".
      '  <td colspan="2"><input class="text" name="email" type="text" size="50" value="' . $email . '"></td>' . "\n".
      '</tr>' . "\n";
  }
  $o .=
    '<tr>' . "\n".
    '  <td>' . $plugin_tx[$plugin]['subject'] . '</td>' . "\n".
    '  <td colspan="2"><input class="text" name="subject" type="text" size="50" value="' . $subject . '"></td>' . "\n".
    '</tr>' . "\n".
    '<tr>' . "\n".
    '  <td valign="top">' . $plugin_tx[$plugin]['text'] . '</td>' . "\n".
    '  <td colspan="2"><textarea class="text" rows="20" cols="60" input name="text">' . $content . '</textarea></td>' . "\n".
    '</tr>' . "\n";
  if($mode == "secure" && $plugin_cf[$plugin]['captcha_mode'] != "none")
    $o .=
      '<tr>' . "\n".
      '  <td>' . $plugin_tx[$plugin]['code'] . '</td>' . "\n".
      '  <td><input class="text" name="validate" type="text" size="10" value=""></td>' . "\n". 
      '  <td>' . 
        getCaptchaHtml("contactus_captcha", $code,
          (int)$plugin_cf[$plugin]['captcha_image_width'],
          (int)$plugin_cf[$plugin]['captcha_image_height'],
          $plugin_cf[$plugin]['captcha_crypt'],
          $plugin_cf[$plugin]['captcha_mode']) . 
      '</td>' . "\n".
      '</tr>' . "\n";
  $o .=
    '<tr>' . "\n".
    '  <td><input class="submit" type="submit" value="' . $plugin_tx[$plugin]['send'] . '"></td>' . "\n".
    '</tr></form></table></fieldset>' . "\n";
  return $o;
}

/*
 * Function to create and handle contact form (Top Level Function).
 *
 */
function contactUs() {
  GLOBAL $plugin_tx,$plugin_cf,$sn,$pth,$_SESSION;
  $plugin = basename(dirname(__FILE__),"/");

  checkGD();

  if(isset($_SESSION['username'],$_SESSION['fullname'], $_SESSION['email'],
           $_SESSION['sessionnr']) && 
     $_SESSION['sessionnr'] == session_id())
    $mode = "logged_in";
  else
    $mode = "secure";

  $ERROR = "";
  $o = "";

  // Get form data if available
  $action    = isset($_POST['action']) ? $_POST['action'] : "";
  $name      = htmlspecialchars(isset($_POST['name']) ? $_POST['name'] : "");
  $email     = htmlspecialchars(isset($_POST['email']) ? $_POST['email'] : "");
  $subject   = htmlspecialchars(isset($_POST['subject']) ? $_POST['subject'] : "");
  $content   = htmlspecialchars(isset($_POST['text']) ? $_POST['text'] : "");
  $captcha   = isset($_POST['captcha']) ? $_POST['captcha'] : "";
  $validate  = isset($_POST['validate']) ? $_POST['validate'] : "";

  // Form Handling
  if($action == "contact_us") {
    if($mode == "secure" && $plugin_cf[$plugin]['captcha_mode'] != "none") {
      if($plugin_cf[$plugin]['captcha_mode'] == "image")
        $code = md5_decrypt($captcha, $plugin_cf[$plugin]['captcha_crypt']);
      elseif($plugin_cf[$plugin]['captcha_mode'] == "formula")
        eval('$code=' .  md5_decrypt($captcha, $plugin_cf[$plugin]['captcha_crypt']) . ";");

      if($validate == "" || strtolower($validate) != $code)
        $ERROR .= "<li>" . $plugin_tx[$plugin]['err_validation'] . "</li>";
    }
    if($name == "")
      $ERROR .= "<li>" . $plugin_tx[$plugin]['err_name'] . "</li>\n";
    if($email == "")
      $ERROR .= "<li>" . $plugin_tx[$plugin]['err_email'] . "</li>\n";
    elseif (!preg_match("/^[^\s()<>@,;:\"\/\[\]?=]+@\w[\w-]*(\.\w[\w-]*)*\.[a-z]{2,}$/i",$email))
      $ERROR .= "<li>" . $plugin_tx[$plugin]['err_email_invalid'] . "</li>\n";
    if($subject == "")
      $ERROR .= "<li>" . $plugin_tx[$plugin]['err_subject'] . "</li>\n";
    if($content == "")
      $ERROR .= "<li>" . $plugin_tx[$plugin]['err_text'] . "</li>\n";
    if($ERROR != "")
      $o .= '<b class="error">' . $plugin_tx[$plugin]['error'] . "</b>\n" . 
        "<ul class=\"error\">\n$ERROR</ul>\n";
    else {
      // prepare email content for contact email
      $content = $content . "\n";
      // send email
      mail(
        $plugin_cf[$plugin]['email'],
        $subject,
        $content,
        'From: ' . $name . " <" . $email . ">\r\n" .
        'Cc: ' . $email . "\r\n" .
        'Reply-To: '  . $email
      );
      $o .= "<b>" . $plugin_tx[$plugin]['contactussent'] . "</b>";
      return $o;
    }
  }
  
  // Form Creation
  if($mode == "secure") {
    if($captcha == "" || md5_decrypt($captcha, $plugin_cf[$plugin]['captcha_crypt']) == "") {
      if($plugin_cf[$plugin]['captcha_mode'] == "image")
        $code = generateRandomCode((int)$plugin_cf[$plugin]['captcha_chars']);
      else if($plugin_cf[$plugin]['captcha_mode'] == "formula")
        $code = generateCaptchaFormula((int)$plugin_cf[$plugin]['captcha_chars']);
      else
        $code = "";
    } else
      $code = md5_decrypt($captcha, $plugin_cf[$plugin]['captcha_crypt']);

    $o .= contactUsEmailForm($mode, $code, $name, $email, $subject, $content);
  } else
    $o .= contactUsEmailForm($mode, "", $_SESSION['fullname'], $_SESSION['email'], $subject, $content);
  
  return $o;
}

/*
 *  This function creates a link for a secure email form (Top Level Function).
 */
function contactuslink() {
  GLOBAL $plugin_cf, $plugin_tx, $sn, $su;
  $plugin = basename(dirname(__FILE__),"/");

  if(isset($su) && urldecode($su) == html_entity_decode(preg_replace("/ /", "_", $plugin_tx[$plugin]['contact_us'])))
    $o .= "\n" . $plugin_tx[$plugin]['contact_us'] . "</a>\n";
  else
    $o .= "\n<a class=\"contactuslink\" href=\"$sn?" . 
          html_entity_decode(preg_replace("/ /", "_", $plugin_tx[$plugin]['contact_us'])) . '">' .
          $plugin_tx[$plugin]['contact_us'] . "</a>\n";
  return $o;
}
?>
 
In der Datei lässt sich gleich viel gezielter eingreifen ;)

Du hast in etwa der Mitte der Datei verschiedene HTML-Quellcodes in den PHP-Ausgaben die sich wunderbar und einfach anpassen lassen.

Such einfach mal mit einem Texteditor nach "<input" (ohne Anführungszeichen und mit der öffnenden spitzen Klammer).

Hinter diesen INPUT-Tags verstecken sich die ganzen Eingabe-Felder. Hinter den Tags stehen dann weitere Informationen, unter anderem die Größe der Felder (z.B. SIZE="50" wie es von vielen verwendet wird).

Bei dem großen Textfeld versteckt sich die Größe in den Parametern ROWS und COLS (Reihen und Spalten) - das große Textfeld heißt übrigens nicht INPUT sondern TEXTAREA (also im Editor einfach danach suchen).

Die Werte hinter SIZE bzw. ROWS und COLS kannst du dann entsprechend deiner Wünsche anpassen. Ist die Textarea z.B. doppelt so breit wie sie sollte reduzierst du den COLS-Wert auf die Hälfe, analog verfährst du mit den Parametern der anderen Eingabefelder, sofern sie zu groß sind.
 
Zeig mal den HTML Output der Tabelle (mag net Code anschaun).

Sonst einfach dem jeweiligen Textfeld width:xx geben.
 
Zurück
Oben