✔ Kontaktformular mit CSS gestalten

[kanecorpse]

Oh man. Dir entgeht aber auch nichts ... Ich hab 2 Tage nicht gepennt. Das erklärt so einiges, wie man sieht. Ich bring das mal fix in Ordnung.

Bei der Gelegenheit hätt ich noch ne Frage. Die Styles liegen alle in einer Datei. Macht es von den Ladezeiten her Sinn, die Styles für z. B. Galerie und Kontaktformular in eine separate Datei auszulagern? Oder sollte man deren besonderen Style-Bereiche in der betreffenden (X)HTML-Datei notieren?

#Edit#
Und die drei rechts gefloateten Elemente sollten eigenttlich alle gleich groß sein. Ändere ich aber #fuss auf width: 610px; , ist die Fußzeile ein Stück zu kurz. Konnte die Ursache nicht finden. Vielleicht fällt es dir auf.

Mit Firebug bin ich noch am Anfang. Werd mich in Zukunft darum bemühen. Versprochen!

greets,
kanecorpse

 

[Maik]

Da sich der Umfang des CSS-Codes für die Galerie und das Formular nun wirklich in Grenzen hält, brauchst du ihn nicht gesondert auszulagern.

Und von einem zentralen Stylesheetbereich (<style type="text/css"></style>) in den einzelnen HTML-Dokumenten würde ich grundsätzlich abraten, da dieser zukünftig anstehende Modifikationen des Projekts unübersichtlich gestaltet, und dann auch mal gerne schnell eine Seite vergessen / übersehen wird. Je nach Umfang des Projekts verbringst du dann unnötig Zeit damit, alles zusammenzusuchen.

Mit einer zentralen CSS-Datei hast du alles schön beisammen, und läufst nicht Gefahr, etwas zu übersehen. Denn in ein paar Jahren weißt du dann sicherlich nicht mehr aus dem Stand, wo die einzelnen Formatierungen überall verstreut sind.

Sprichst du bei den drei Elementen von der Seite "mailok.html"?

Im HTML-Code findet sich da zwischen den DIV-Blöcken .maintitle und #fuss ein DIV namens #contentst. Im Stylesheet heißt es aber sinnigerweise #content.

Wenn ich die diskrepante ID-Bezeichnung aufeinander abstimme, sieht's gleich passabel aus



An deiner Stelle würde ich jetzt mal alles runterfahren (PC, Geist und Körper), und mich für die nächsten Stunden in die Koje verziehen. Eine Mütze voll Schlaf soll da große Wunder wirken, wenn's um die Konzentration schlecht bestellt ist

mfg Maik

 

[kanecorpse]

Nee, das ist in jeder Datei so. Unten im #fuss ist eine Weite von 628px angegeben. Dagegen stehen jeweils 610px für content und maintitle. Das muß ich nochmal genau nachrechnen. Da sitzt irgendwo ein Bock drin. Wenn das was mit dem Abstand von #content zu den Inhaltselementen zu tun hat, müsste theoretisch maintitle mit 610px auch zu kurz sein. Aber das wird korrekt angezeigt.

#contentst brauchte ich für eine bestimmte Seite. Die musste anders gestylt sein. Weiß jetzt aber nicht, ob sie das überhaupt noch nötig ist. Das sehe ich Sylvester. Denn bis dahin werde ich die Seite "hoffentlich" ganz fertig haben.

2 Stunden noch, dann gehts in die Falle

greets,
kanecorpse

 

[Maik]

Aber wir reden schon von diesen drei DIV-Blöcken?

#maintitle {
 float: right;
 font-weight: bold;
 width: 610px;
 background-color: #DFCCA6;
 padding: 0px 10px;
 border-top: 1px solid #643200;
 border-left: 1px solid #643200;
 border-right: 1px solid #643200;
}
#content {
 float: right;
 font-family: Verdana;
 font-size: 12px;
 width: 610px;
 background-image: url(conie.jpg);
 padding: 10px;
 border: 1px solid #643200;
}
#fuss {
 font-family: Verdana;
 font-size: 7pt;
 color: #000000;
 text-align: center;
 padding: 1px;
 float: right;
 height: 16px;
 width: 628px;
 background-color: #F2E3B7;
 border-bottom: 1px solid #643200;
 border-left: 1px solid #643200;
 border-right: 1px solid #643200;
}

Gemäß dem "Box-Modell" beträgt bei allen drei ihre "Gesamtbreite" 632px.

• #maintitle

610px (width) + 2*10px (padding-left/-right) + 2*1px (border-left/-right) = 632px

• #content

610px (width) + 2*10px (padding-left/-right) + 2*1px (border-left/-right) = 632px

• #fuss

628px (width) + 2*1px (padding-left/-right) + 2*1px (border-left/-right) = 632px

Und wie in meinem angehängten Schnappschuß unschwer zu erkennen ist, ist keiner von ihnen zu kurz, oder zu breit.


mfg Maik

 

[kanecorpse]

Genau die 3 sind gemeint. Dann ist es in #fuss mit 628px doch richtig. Mit der Rechnung kann ich das auch gut nachvollziehen

Deine Tips werde ich beherzigen. Die sind auch speziell für Leute mit Lernschwierigkeiten eine unschätzbare Hilfestellung. Es ist nicht imme einfach für "normale" Leute die Geduld zu wahren, wenn sie mit unsereins scheinbar einfache Dinge mehrmals durchgehen müssen. Da möchte ich mich einmal gesondert bei allen Helfern hier bedanken. Thanx a lot

Jetzt ist erstmal Schluß für die nächsten Stunden. Bis später, wer weiß ....

greets,
kanecorpse

 

[Maik]

Wenn du dich mal, so wie ich, knappe 10 Jahre mit der Materie beschäftigst, kannst du vieles im Schlaf, denn dann sind dir die Gesetzmäßigkeiten und Zusammenhänge in Fleisch und Blut übergegangen, so wie im Berufsleben auch, wo ich mit dem Webdesign nichts am Hut habe

Für meine Ruhe und Geduld werde ich nicht nur hier im Forum geschätzt - meine Süße bewundert mich auch immer, wenn's mal stressig wird (wie beispielsweise beim Umzug), und ich dennoch nicht aus der Reserve zu locken bin

mfg Maik