Problem mit fieldset

[Enrico]

Hallo,

Die Probleme mit meinem CSS-Layout sind nun endlich beseitigt.

Jetzt gilt es nur noch, das Layout meines Gästebuch-Formulares zu beseitigen:
<img src="http://rotfuchs-w-1983.piranho.com/anzeigeproblem_formular.jpg" border="0" alt="">

Alternativ dazu der Link:
http://rotfuchs-w-1983.piranho.com/anzeigeproblem_formular.jpg

Hier stellen sich mir mehrere Probleme:

1. Die Bezeichner der Eingabefelder soll alle rechtsbündig ausgerichtet werden. Geht zwar über eine feste Breitenangabe, nur war ich mir bei dieser Umsetzung nicht sicher, ob es da nicht Anzeige-Probleme geben kann (Verschiebung).

Wenn ich die Bezeichner ausgerichtet habe, dann stehen auch die Eingabefelder bündig untereinander

2. Wie bekomme ich den Abstand der Legende ("Neuen Eintrag erstellen") zum ersten Bezeichner und zum ersten Eingabefeld weg ? Habe es schon mit margin und padding versucht, aber erfolglos. Kann man den Abstand möglicherweise gar nicht beeinflussen ?

3. Zuguterletzt soll sich die Breite des fieldsets nach dessen Inhalt richten, ohne dass ich eine feste Breite angeben muss. Momentan geht es noch nicht, dass ich die Breitenangabe weglasse, weil das fieldset dann über die gesamte Bildschirmbreite gezogen wird.

Gruss, Enrico
PS: Anmerkung zum Schluss: Die Breite der Eingabefelder ist nur zu Testzwecken so klein gewählt, wird aber später selbstverständlich noch geändert.

[Bild wurde nicht eingebunden >>> Enrico]

Zum wiederholten Mal wurde ein Bild nicht eingebunden. Klickt man den Link an, dann bekommt man nur die Fehlermeldung, dass man keine Berechtigung hat.

Nun gut, ich hoffe, Ihr kommt so auch zurecht.

Als Ergänzung die CSS-Angaben für das Formular:

fieldset
{
  border:  #26a solid 2px;
  width:   230px;
  padding: 5px
}

legend
{
  padding-top:    2px;
  padding-bottom: 3px;
  padding-left:   4px;
  padding-right:  4px;
  background:     #26a
}

label
{
  float:         left;
  text-align:    right;
  padding-right: 10px;
  clear:         both
}

.Eingabefeld
{
  width:            50px;
  float:            left;
  margin-bottom:    10px;
  border:           1px solid #000000;
  background-image: url(pic/gfx/L_schatten_eingabefelder.gif);
  overflow:         hidden
}

.Abschicken,
.Loeschen
{
  color:         #ffffff;
  background:    #26a;
  border:        1px #9cf outset
}

.Abschicken
{
  clear: both;
  float: left
}

.Loeschen
{
  float: right
}

[Galahad]

Hallo,

Die Probleme mit meinem CSS-Layout sind nun endlich beseitigt.

Jetzt gilt es nur noch, das Layout meines Gästebuch-Formulares zu beseitigen:
<img src="http://rotfuchs-w-1983.piranho.com/anzeigeproblem_formular.jpg" border="0" alt="">

Alternativ dazu der Link:
http://rotfuchs-w-1983.piranho.com/anzeigeproblem_formular.jpg

Hier stellen sich mir mehrere Probleme:

1. Die Bezeichner der Eingabefelder soll alle rechtsbündig ausgerichtet werden. Geht zwar über eine feste Breitenangabe, nur war ich mir bei dieser Umsetzung nicht sicher, ob es da nicht Anzeige-Probleme geben kann (Verschiebung).

Wenn ich die Bezeichner ausgerichtet habe, dann stehen auch die Eingabefelder bündig untereinander

<table><tr><td style="text-align:left;">
Eingabefelder
</td><td styke="text-align:right;">
Bezeichner
</td></tr></table>

2. Wie bekomme ich den Abstand der Legende ("Neuen Eintrag erstellen") zum ersten Bezeichner und zum ersten Eingabefeld weg ? Habe es schon mit margin und padding versucht, aber erfolglos. Kann man den Abstand möglicherweise gar nicht beeinflussen ?

border-spacing??
 »» 3) Zuguterletzt soll sich die Breite des fieldsets nach dessen Inhalt richten, ohne dass ich eine feste Breite angeben muss. Momentan geht es noch nicht, dass ich die Breitenangabe weglasse, weil das fieldset dann über die gesamte Bildschirmbreite gezogen wird.
size:x; ???

Gruss Galahad

[MudGuard]

Hi,

Jetzt gilt es nur noch, das Layout meines Gästebuch-Formulares zu beseitigen:

Das sollte doch kein Problem sein, einfach alle darauf zutreffenden Layout-Angaben (also CSS-Styles) entfernen, dann ist auch das Layout beseitigt ;-)

<img src="http://rotfuchs-w-1983.piranho.com/anzeigeproblem_formular.jpg" border="0" alt="">

Dein Webspace prüft den Referrer, daher ist das Bild nicht im Beitrag sichtbar

http://rotfuchs-w-1983.piranho.com/anzeigeproblem_formular.jpg

Hilft auch nicht, da der Referrer auch hier übertragen wird...

2. Wie bekomme ich den Abstand der Legende ("Neuen Eintrag erstellen") zum ersten Bezeichner und zum ersten Eingabefeld weg ? Habe es schon mit margin und padding versucht, aber erfolglos. Kann man den Abstand möglicherweise gar nicht beeinflussen ?

Ohne den beteiligten Code kann man da wenig sagen. (und zu Deinem zweiten Posting: CSS ist ohne das zugehörige HTML wertlos)

3. Zuguterletzt soll sich die Breite des fieldsets nach dessen Inhalt richten, ohne dass ich eine feste Breite angeben muss. Momentan geht es noch nicht, dass ich die Breitenangabe weglasse, weil das fieldset dann über die gesamte Bildschirmbreite gezogen wird.

margin:auto

cu,
Andreas

[Zeromancer]

Hallo,

woran lag es denn nun bei deinen Problemen?

Mit freundlichen Grüßen

André

[Enrico]

Zunächst mal den HTML-Code:

<fieldset>
  <legend>Neuen Eintrag erstellen</legend>
  <form>
    <label for="name">* Name</label>
    <input type="text" id="Name" name="name" class="Eingabefeld"><br>
    <label for="email">eMail</label>
    <input type="text" id="email" name="email" class="Eingabefeld"><br>
    <label for="homepage">Homepage</label>
    <input type="text" id="homepage" name="homepage" class="Eingabefeld"><br>
    <label for="kommentar">* Kommentar</label>
    <textarea id="kommentar" name="kommentar" class="Eingabefeld" rows="8"></textarea><br>
    <input type="submit" value="Abschicken" class="Abschicken">
    <input type="reset" value="Löschen" class="Loeschen">
  </form>
</fieldset>

...und nochmal die zugehörigen Definitionen der CSS-Datei:

fieldset
{
  border:  #26a solid 2px;
  width:   230px;
  padding: 5px
}

legend
{
  padding-top:    2px;
  padding-bottom: 3px;
  padding-left:   4px;
  padding-right:  4px;
  background:     #26a
}

label
{
  float:         left;
  text-align:    right;
  padding-right: 10px;
  clear:         both
}

.Eingabefeld
{
  width:            50px;
  float:            left;
  margin-bottom:    10px;
  border:           1px solid #000000;
  background-image: url(pic/gfx/L_schatten_eingabefelder.gif);
  overflow:         hidden
}

.Abschicken,
.Loeschen
{
  color:      #ffffff;
  background: #26a;
  border:     1px #9cf outset
}

.Abschicken
{
  clear: both;
  float: left
}

.Loeschen
{
  float: right
}

Probleme sind:

1. Der unschöne Abstand zwischen der Bezeichnung der Legende und dem ersten Eingabefeld:

+-------------------------+
+-+ Neuen Eintrag erstellen +-------+
| +-------------------------+       |
|                                   |
|                                   |
|                                   |
|       +-------------------------+ |
| Name: |                         | |
|       +-------------------------+ |
|                                   |
|        +------------------------+ |
| eMail: |                        | |
|        +------------------------+ |
|                                   |
+-----------------------------------+

2. Die Breite des fildsets soll sich nach dessen Inhalt richten, ohne dass ich mich um die genaue Breitenangabe kümmern muss.

Die von MudGuard (Andreas) vorgeschlagene Anweisung margin:auto funktioniert nicht. Hier wird das fieldset ebenfalls über die gesamte Bildschirmbreite gezogen.

Gruss, Enrico

[Zeromancer]

Hallo,

ups, da habe ich mich missverständlich ausgedrückt. Ich meinte dein Problem von gestern und meinen Vorschlag die Anführungsstriche aus den urls zu nehmen.

Mit freundlichen Grüßen

André

[Enrico]

Hallo André,

die habe ich sofort entfernt.

Ich dacht, die müssten angegeben werden, aber SELFHTML hat mich da eines besseren belehrt :o)

Und schon hat's funktioniert :-))

Gruss, Enrico