Thomas Schmieder: CSS-Angaben für Buttons

Hallo,

ich möchte Submit-Buttons mit CSS benutzerdefiniert formatieren. Leider finde ich die CSS-Attribute nicht, die bei <input type=submit" ...> möglich sind. Könnt Ihr mir mal die Tomaten von den Augen nehmen?

Liebe Grüße aus http://www.braunschweig.de

Tom(ate)

--
Intelligenz ist die Fähigkeit, aus Fehlern Anderer zu lernen und Mut die, eigene zu machen.
  1. Hallo,

    ich möchte Submit-Buttons mit CSS benutzerdefiniert formatieren. Leider finde ich die CSS-Attribute nicht, die bei <input type=submit" ...> möglich sind. Könnt Ihr mir mal die Tomaten von den Augen nehmen?

    Liebe Grüße aus http://www.braunschweig.de

    Tom(ate)

    »»

    Hi Tom,
    ich habe Dir einfach mal einen Ausschnitt aus meinem Code kopiert:

    input,textarea {
     border : 1px solid #bfbfbf;;
     background-color : #989898;
    }

    Generell sind einfach alle Angaben für Rahmen möglich, aber vorsicht:
    Netscape erst ab 6 und auch da nicht richtig, Opera macht die Rahmen korrekt aber die plastischen Felder lässt er nicht; IE machts perfekt.

    Viel Spass

    1. Hi,

      ich danke Euch.

      So müsste ich schon zum mZiel kommen.

      Tom

      1. Hi,

        hat mit Eurer Hilfe natürlich geklappt. Will hier nur kurz ein Ergebnis wiedergeben, weil ich es leider zur Zeit nicht per Server veröffentlichen kann. Mein Access-Provider hat Insolvenz angemeldet und verarscht mich jetzt. Ich werde wohl am Montag Strafanzeige stellen. Schad eigentlich.

        <?php  ##### edit.php #####

        //---  Diese Funktion gibt es ab PHP 4.1.x, meine ist leider älter ------

        function array_key_exists($name,$Post)
        {
          foreach($Post as $key => $value)
          {
            if ($key==$name)
            {
              //echo $key."<br>";

        return true;
            }
          }
          return false;
        }

        //------ Diese Funktion liefer die Zeilennummer der Liste -----------.
        //------ die Nr sollte gelich der ID des Datensatzes sein ------------

        function getLineNr($Post, $name)
        {
          if (array_key_exists($name,$Post))
          {
            //echo " es geht <br>";
            if (is_array($Post[$name]))
            {
              return key($Post[$name]);
            }
          }
          return false;
        }

        ########### Hauptprogramm Editieren von Daten....#############

        echo "Zeile: ".getLineNr($HTTP_POST_VARS, "zeile")."<br />";
        echo "Element-Wert: ".$HTTP_POST_VARS["zeile"][key($HTTP_POST_VARS["zeile"])]."<br />";

        // hier könnte dann der ausgewählte Datensatz editiert werden
        ?>
        --------------------------------------------------------

        <!-- Liste.html ----- kommt i.d.R aus einer Datenbank ---
        <html>
        <head>

        <title>Liste anzeigen</title>

        <link rel="stylesheet" type="text/css" href="formate.css">
          <style type="text/css">
          <!--
            ... hier sind datei-spezifische Formate erlaubt ...
          -->
          </style>

        </head>
        <body>

        <form action = "edit.php" method="post" entype="mutipart/form-data">
        <table>
          <tr>
            <td>
              <input type="submit" class="TableClass" name="zeile[1]" value="Hubert">
            </td>
            <td style="width:40px">
              <input type="submit" class="TableClass" name="zeile[1]" value="38106">
            </td>
            <td>
              <input type="submit" class="TableClass" name="zeile[1]" value="Braunschweig-Stöckheim">
            </td>
          </tr>

        <tr>
            <td>
              <input type="submit" class="TableClass" name="zeile[2]" value="Klara">
            </td>
            <td style="width:40px">
              <input type="submit" class="TableClass" name="zeile[2]" value="33007">
            </td>
            <td>
              <input type="submit" class="TableClass" name="zeile[2]" value="Hannover" >
            </td>
          </tr>

        <tr>
            <td>
              <input type="submit" class="TableClass" name="zeile[3]" value="Rolf-Dieter">
            </td>
            <td style="width:40px">
              <input type="submit" class="TableClass" name="zeile[3]" value="12123">
            </td>
            <td>
              <input type="submit" class="TableClass" name="zeile[3]" value="Berlin-Tegel">
            </td>
          </tr>

        <tr>
            <td>
              <input type="submit" class="TableClass" name="zeile[4]" value="Knalltüte">
            </td>
            <td style="width:40px">
              <input type="submit" class="TableClass" name="zeile[4]" value="">
            </td>
            <td>
              <input type="submit" class="TableClass" name="zeile[4]" value="Nirgendwo">
            </td>
          </tr>

        </table>
        </form>

        </body>
        </html>
        ------------------------------------------------------

        /* formate.css */

        body
        {
          background-color:#FFFFFA;
          margin-left:100px;
        }

        h1
        {
          font-size:48pt;
          color:#FF0000;
          font-style:italic;
          border-bottom:solid thin black;
        }

        p,li
        {
          font-size:12pt;
          line-height:14pt;
          font-family:Helvetica,Arial,sans-serif;
          letter-spacing:0.2mm;
          word-spacing:0.8mm;
          color:blue;
        }

        table
        {
          font-size:10pt;
          line-height:10pt;
          font-family:Helvetica,Arial,sans-serif;

        cellspacing:0px;
          cellpadding:0px;

        /*border:1px solid blue; */
          border-spacing:10px;
          border-collapse:collapse;
        }

        td
        {
          border-top: 1px solid blue;
          border-bottom: 1px solid blue;
          border-left: 0px;
          border-right: 0px;

        }

        input.TableClass
        {
          font-size:8t;
          line-height:8pt;
          font-family:Helvetica,Arial,sans-serif;
          font-weight:500;

        color:#000000;
          width:100%;
          height: 18px;
          text-align:left;
          border-left: 2px solid #F0F0F0;
          border-right: 2px solid #F0F0F0;
          border-bottom: 1px solid #F0F0F0;
          border-top: 1px solid #F0F0F0;
          margin: 0px;
          background-color: #F0F0F0;
        }

        Liebe Grüße aus http://www.braunschweig.de

        Tom

        --
        Intelligenz ist die Fähigkeit, aus Fehlern Anderer zu lernen und Mut die, eigene zu machen.
  2. Hallo,

    ich möchte Submit-Buttons mit CSS benutzerdefiniert formatieren. Leider finde ich die CSS-Attribute nicht, die bei <input type=submit" ...> möglich sind. Könnt Ihr mir mal die Tomaten von den Augen nehmen?

    .linkbutton {
     color:#0000bb;
     font-size:11px;
     border-bottom:1px solid white;
     border-top:1px solid white;
     border-left:1px solid white;
     border-right:1px solid white;
     background-color:white;
     text-decoration:underline;
     cursor:pointer
    }

    ich hab es so gemacht, dann siehts aus wie ein link, lass underline weg und es sollte so sein wie du es wünschst!
    Hintergrundfarbe und borderfarbe natürlich anpassen, oder border gleich weglassen

    ansonsten gehen alle gängigen css-Angaben, die Du nur brauchst

    ciao
    romy

    --
    DIE ROMY AUS L. AN DER P. SAGT DANKE UND AUF WIEDERSEHEN
    ->Alles ist gut wenn es aus Schokolade ist
    1. Hallo,

      ich persönlich finde ja

      input {color:transparent;}

      ziemlich gut (nicht bei OPERA)

      Gruß

      André

      1. Halli,

        input {color:transparent;}

        Das ist aber kein gültiges CSS.
        transparent ist bei color nicht erlaubt.

        transparent ist erlaubt bei
        background-color,
        border-color,
        border-left-color,
        border-right-color,
        border-top-color,
        border-bottom-color,
        (wobei das für die letzten 4 Werte nur in den Errata zu CSS2 drinsteht, nicht in CSS2 selbst).

        cu,
        Robert

        1. input {color:transparent;}
          Das ist aber kein gültiges CSS.
          transparent ist bei color nicht erlaubt.

          Shit, und es sieht soooooooooooooooooooooooooooooo gut aus bei passendem Hintergrund. Schreibe jetzt mal an das W3C. Da smuss doch klappen. :-)

          LG

          André

        2. Halli,

          input {color:transparent;}
          Das ist aber kein gültiges CSS.
          transparent ist bei color nicht erlaubt.

          Is ja richtig. War ein wenig durch den Wind. Meinte, habe noch mal nachgeschaut:

          input {background-color:transparent;}  -> nicht OPERA 6.05

          Das sieht schau aus.

          LG

          André

          PS: Beim nachdenken, welchen Sinn macht color:transparent?

          1. Hi,

            PS: Beim nachdenken, welchen Sinn macht color:transparent?

            Keinen. Darum ist es nicht erlaubt.
            cu,
            Andreas

            --
            Der Optimist: Das Glas  ist halbvoll.
            Der Pessimist: Das Glas ist halbleer.
            Der Ingenieur: Das Glas ist doppelt so groß wie nötig.