✔ Tabellen Problem

Status
Nicht offen für weitere Antworten.
N

No-Body

Gesperrt
Hallo liebe User °°

Hab grade ein Problem mit CSS -> Hab ein Bild Länge 1000px Höhe 42px,das hab ich in einer div box gemacht, HIER mal der Code:

PHP: 
div.boks  {
	height: 42px;
	width: 1000px;	
	background-image: url("leiste.JPG");	
        }

Will jetzt auf den Bild eine Tabelle bauen mit 4 x <td> Das erste soll nur eine Schrift sein,das 2te soll ein Inputfeld sein,das 3te is auch ein Inputfeld ,und das 4te is der Login Botten.Das funktioniert auch pervect hier mal der Code :

PHP: 
<head>
<link rel="stylesheet" type="text/css" href="css.css" />
<script type="text/javascript">
function ClickIntoForm(id, standardvalue)
 {
  var inputvalue = document.getElementById(id).value;
  if (inputvalue == standardvalue)
  {
   document.getElementById(id).value = '';
      document.getElementById(id).style.color = '#000000';
  }
 }
</script>

</head>

<body>
<div class="boks">
<form action="seite2.php" method="post">
  <tr>
  <td><span style="color:#ffffff">Deutschland´s Größte Linktausch Börse</span></td>

   
    <td><input type="text" name="suchtext" style="width:100px; color:#999999;" value="Username" id="input1" 
	 onclick="ClickIntoForm('input1', 'Username');" />
   </td>

    <td>
      <input type="text" name="uploader" style="width:100px; color:#999999;" value="Passwort" id="input2" 
       onclick="ClickIntoForm('input2', 'Passwort');" />
    </td>
    <td>
     <input type="Submit" value="Login">
    </td>
  </tr>
</div>
</body>

Wie ihr seht is die ganze Tabelle nur da hin geklatscht und ich würde sie gerne Ausrichten ,allso erst mal soll alle <td> von der Höhe (42px) mittig sein glaube das Inputfeld hat in die Höhe (20px) dann soll zwischen oben 11px apstand sein und von unten 11px,versteht bestimmt was ich meine so jetzt würde ich das gerne noch in die Länge Ausrichten das ich jedes <td> auf der Länge von (1000px) ausrichten kann ,hoffe hab das gut erklärt ,bekomm es einfach nicht hin ,irgentwie verändert sich das <td> nie sry bin anfänger aber lese schon seit tagen in forum´s und lese schon zum 10mal ein tut ,könnte mir das bitte jemand zeigen wie das geht .

Gruß No-Body:rolleyes:
 
warum baust du dieses "login" feld nicht mit div's auf ?!

ich habe vor 2 tagen glaube ich ein kontaktformular mit css erstellt.
so sieht der code davon aus:

Code: 
*       {margin: 0; padding: 0;}

body    {font-family: arial, verdana, sans-serif;
        font-size: 100.01%;
        background: white;
}

fieldset {
        width: 400px;                     /* Breite des Kontaktfeldes*/
        margin: 1.5em auto 1.5em auto;    /* setzt das Kontanktfeld mittig und bischen tiefer */
        display: block;
        font-size: 0.80em;
        border: 1px solid #ddd;
        clear: both;
}

fieldset legend {                           /* formatiert das eingeblockte "Kontaktformular" (orangener Hintergrund)*/
        background-color: #fce9be;
        padding: 4px;
        border: 1px solid #ddd;
        margin-left: 4px;
        margin-bottom: 10px;
        font-weight: bold;
}

fieldset label {                            /* formatiert die Eintraege neben den Inputboxen */
        margin-left: 4px;
        margin-bottom: 4px;
        display: block;
        width: 120px;
        float: left;
}

fieldset input {width: 240px;}
fieldset input#absenden {width: 100px; background-color: #fce9be;}

fieldset input, textarea {                  /* setzt Abstaende nach unten zwischen den Inputboxen*/
        margin-bottom: 4px;
        border: 1px solid #ddd;
}
Code: 
<div id="Kontaktfeld">
    <fieldset>
        <legend>Kontaktformular</legend>
        <label for="vorname">Vorname: *</label>
        <input name="vorname" id="vorname" type="text"  /><br />
        <label for="nachname">Nachname: *</label>
        <input name="nachname" id="nachname" type="text"  /><br />
        <label for="email">E-Mail-Adresse: *</label>
        <input name="email" id="email" type="text"  /><br />
        <label for="betreff">Betreff: *</label>
        <input name="betreff" id="betreff" type="text"  /><br />
        <label for="mitteilung">Mitteilung: *</label>
        <textarea name="mitteilung" id="mitteilung" cols="30" rows="5"></textarea><br />
        <label for="absenden" class="offview"></label>
        <input value="Absenden" id="absenden" type="submit">
    </fieldset>
</div>
 
WoW Danke für die schnelle Antwort versuch das mal °°

// EDIT

Danke für die schnelle Antwort ,aber verstehe nicht wirklich was davon ,hast du oder vieleicht jemand anderes einen Code der meiner Frage schon recht nahe kommt ?

Gruß No-Body
 
hier ist nochmal alles mit etwas rauslöschen und etwas umbenennen:
zudem noch anders farblich gestalltet, damit dusehen kannst, wo man was findet:
Code: 
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="de" lang="de">

<head>

	<title>Login</title>
	

	<meta http-equiv="content-type" content="text/html;charset=iso-8859-1" />
<style>

*       {margin: 0; padding: 0;}

body    {font-family: arial, verdana, sans-serif;
        font-size: 100.01%;
        background: white;
}

fieldset {
        width: 400px;                     /* Breite des Kontaktfeldes*/
        margin: 1.5em auto 1.5em auto;    /* setzt das Kontanktfeld mittig und bischen tiefer */
        display: block;
        font-size: 0.80em;
        border: 1px solid red;
        clear: both;
}

fieldset legend {                           /* formatiert das eingeblockte "Kontaktformular" (orangener Hintergrund)*/
        background-color: lime;
        padding: 4px;
        border: 1px solid black;
        margin-left: 4px;
        margin-bottom: 10px;
        font-weight: bold;
}

fieldset label {                            /* formatiert die Eintraege neben den Inputboxen */
        margin-left: 4px;
        margin-bottom: 4px;
        display: block;
        width: 120px;
        float: left;
}

fieldset input {width: 240px;}
fieldset input#absenden {width: 100px; background-color: magenta;}

fieldset input, textarea {                  /* setzt Abstaende nach unten zwischen den Inputboxen*/
        margin-bottom: 4px;
        border: 1px solid #ddd;
}
</style>

</head>

<body>
<div id="Kontaktfeld">
    <fieldset>
        <legend>Logindaten</legend>
        <label for="nick">Nickname: *</label>
        <input name="nickname" id="nickname" type="text"  /><br />
        <label for="password">Passwort: *</label>
        <input name="password" id="password" type="text"  /><br />
        <label for="absenden" class="offview"></label>
        <input value="Absenden" id="absenden" type="submit">
    </fieldset>
</div>
</body>

</html>
 
Danke,aber das hab ich auch verstanden wen man was weg macht das es dan weniger wird. Du hast ja in deinen Code die Sachen ja unter einander und ich brauche halt ein Beispiel das von links nach rechts geht sry totaller anfänger :confused:

gruß No-Body
 
Um Sachen nebeneinader zu bekommen wird eigendlich keine Tabelle gebraucht.

Hier mal grob:
HTML: 
<p>Deutschland´s Größte Linktausch Börse <input type="text" name="foo" /> <input type="text" name="bar" /> <input type="submit" value="senden" /></p>
 
Hi,

wenn du schon unbedingt eine Tabelle einbinden willst, solltest du sie auch mit dem <table>-Tag öffnen und mit dem </table>-Tag schliessen.

Code: 
<div class="boks">
<form action="seite2.php" method="post">
<table>
  <tr>
  <td><span style="color:#ffffff">Deutschland´s Größte Linktausch Börse</span></td> 
    <td><input type="text" name="suchtext" style="width:100px; color:#999999;" value="Username" id="input1" 
     onclick="ClickIntoForm('input1', 'Username');" />
   </td>
    <td>
      <input type="text" name="uploader" style="width:100px; color:#999999;" value="Passwort" id="input2" 
       onclick="ClickIntoForm('input2', 'Passwort');" />
    </td>
    <td>
     <input type="Submit" value="Login">
    </td>
  </tr>
</table>
</form>
</div>
 
Danke liebe User °°

Allso wie man eine tabelle macht weis ich jetzt aber das mit der Positionierung der einzelen <td> felder nicht so das ich nur an 00px einstehlen kann wo alles seihen soll von rechts nach links und von oben nach unten soll alles genau mittig sein ?

Gruß No-Body
 
Zuletzt bearbeitet:
Diese CSS-Regeln dürften dir bei deinem Anliegen weiterhelfen:

Code: 
div.boks table {
width:1000px;
}
div.boks td {
height:42px;
text-align:center;
vertical-align:middle;
}
 
Danke Maik°!°

Verstehe nicht wie ich damit 4 verschiedene <td> Ausrichten soll sry bischen genauer bitte,bin wenn um css geht voll der Anfänger, könnt ihr bitte mal an Hand von meinen Code den ich als erstes gemacht hab zeigen was ich da bei jeden <td> einfügen mus damit er die css auch richtig macht und dan halt die css für jedes <td> dan verstehe ich das bestimmt .

Gruß No-Body

PS:hoffe nerv nicht °°:suspekt:
 
Status
Nicht offen für weitere Antworten.

Neue Beiträge

Zurück