Radiobox: Problem mit Abständen

- WebmasterWork »
- Grafik & Programmierung »
- (X)HTML & CSS & DHTML & Javascript »
- Radiobox: Problem mit Abständen »

Toast

Tripel-As

Dabei seit: 02.01.2011

Beiträge: 210

Samstag, 10. Dezember 2011, 12:43

Hi.

Was mir momentan Probleme bereitet:
Ich habe ein Formular und möchte es mittels CSS formatieren. Leider spielen die Radioboxen da nicht ganz so mit. Und zwar möchte ich, dass die erste quasi einen margin-left mit 10em hat, und daneben dann die andere steht, sodass alles bündig im Formular aussieht. Mein Problem ist nun, dass selbst ohne margin die Boxen ziemlich verrückt aussehen. Weiß jemand an welcher Eigenschaft das liegt? Ein Screen ist unten angehängt.
Ich habe folgenden CSS-Code:

Spoiler
Cascading Style Sheet
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
label{
  display: block;
  float: left;
  width: 10em;
}
input.radioboxer{
  margin: 0;
  padding: 0;
  width: 12em;
}
input.text{
  width: 24em;
}
input.front_nr{
  width: 18em;
}
input.nr{
  width: 6em;
}
input.checks{
  height: 1em;
  margin-left: 3em;
  width: 1em;
}

Und folgenden Code im Formular:

Spoiler
HTML
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
<html>
<head>
<link rel="stylesheet" type="text/css" href="form.css">
<title>Kundenkartei anlegen</title>
</head>
<body>
<form action="konktakt.php" method="post" accept-charset="ISO-8859-1" name="new_kunde">
  <p><label>Auftragsnummer:</label><input name="auftragsnummer" type="text" class="text" readonly></p>
  <p><input type="radio" name="geschlecht" value="0" class="radioboxer">Frau<input type="radio" name="geschlecht" value="1" class="radioboxer">Herr</p>
  <p><label>Vorname:</label><input name="vorname" type="text" class="text"></p>
  <p><label>Nachname:</label><input name="nachname" type="text" class="text"></p>
  <p><label>Straße, Hausnummer:</label><input name="strasse" type="text" class="front_nr"><input name="hausnummer" type="text" class="nr"></p>
  <p><label>Postleitzahl, Ort:</label><input name="plz" type="text" class="nr"><input name="ort" type="text" class="front_nr"></p>
  <p><label>Telefonnummer:</label><input name="tel" type="text" class="text"></p>
  <p><label>Handynummer:</label><input name="handy" type="text" class="text"></p>
  <p><label>Faxnummer:</label><input name="fax" type="text" class="text"></p>
  <p><label>E-Mail-Adresse:</label><input name="email" type="text" class="text"></p>
  <p><label>Website-Adresse:</label><input name="website" type="text" class="text"></p>
  <p><label>Geburtsdatum:</label><input name="website" type="text" class="text"></p>
  <p><input type="submit" id="id_submit" value=" Absenden " name="button"></p>
</form>
</body>
</html>

»Toast« hat folgendes Bild angehängt:

Vulpire GbR - Marketingagentur in Köln und Dülmen

Creature

Routinier

Dabei seit: 16.08.2010

Beiträge: 354

Samstag, 10. Dezember 2011, 14:34

bin zwar selber anfänger, aber schon mal probiert die Werte im css mal auf "0" zu stellen, so in etwa:

zu beginn der Zeile

* {
margin:0;
padding:0;
}

Toast

Tripel-As

Dabei seit: 02.01.2011

Beiträge: 210

Samstag, 10. Dezember 2011, 15:05

Nein, hilft nicht. Hätte mich aber auch, ehrlich gesagt, gewundert, weil die Elemente ja ein entsprechendes margin bzw. padding haben.

LG

EDIT: Ich habe den Fehler gefunden :rolleyes:

. Die Breite, die ich für die Radioboxen definiere wirken sich natürlich nur auf die eigentliche Box aus. Sprich auf den "Anklickkreis", somit wird das ganze Feld als 12em dargestellt. Das Wollte ich jedoch ja gar net (ich mus also das Feld klein machen und den Text neben dem Feld entsprechend auf 12em ausdehnen).

Vulpire GbR - Marketingagentur in Köln und Dülmen

Dieser Beitrag wurde bereits 1 mal editiert, zuletzt von »Toast« (10. Dezember 2011, 15:05)

Radiobox: Problem mit Abständen

Cascading Style Sheet

HTML

Ähnliche Themen