Forum
Tipps
News
Menu-Icon

Hat dir diese Antwort geholfen?

Danke ButtonHilfreiche Antwort Button

das irst Letter-Element war nur zum Testen noch drin, und ich habs aus Versehen nicht rausgenommen... aber trotzdem danke für den Hinweis.

Bzgl. der divs nebeneinander, hab ich im Buch nachgelesen, dass dies wohl nicht gehen würde, weil dies nur Blöcke definiert, die dann hintereinander gezeigt werden (egal, was jetzt drin erscheint).

 

Hat dir diese Antwort geholfen?

Danke ButtonHilfreiche Antwort Button

Ist so nicht richtig. Dazu verwendest Du eben die float-Anweisungen. Eben float:left oder float:right. Nach dem zugewiesenen Div sollte aber mit clear:both die floatoption aufgehoben werden.

Am besten Du schaust Dir mal fertige oder angehende Tutorials an. Da versteht man eher das zusammenspiel der vielen Attribiute und Formatierungen!

Nimm Dir ein Grundgerüst einer Beispielsseite her und experimentiere damit. Du wirst sehen, wie schnell man hinter einigen Kniffs oder Problemen kommt. ;O)

Ich schreibe aus Erfahrung.^^

http://css.talky.de

http://barrierefrei.e-workers.de/

http://www.css4you.de/

Nun wünsche ich viel Spaß beim Stöbern und Probieren.

gruß saffi

Hat dir diese Antwort geholfen?

Danke ButtonHilfreiche Antwort Button

so... mensch bin ich bescheuert... zumindest teilweise:

<HTML>
<head>
   <link href="css/css.css" rel="stylesheet" type="text/css">
   </link>

</head>

<body>
   <p>Hier ist dann der erste Text im Dokument eingetragen</p>
   <div id="header">
      <div id="header_logo_links">
         <p>hier kommt das LOGO rein</p>
      </div>
      <div id="header_spacer">
         <p>hier käme eine Spacer rein</p>
      </div>
      <div id="header_search">
         <p>hier käme später das Suchfeld rein</p>
      </div>
</body>
und css:
body{
valign:center;
width:780px;
border=1px;
color:white;
background-color:black}

#header {
height:70px}

#header_logo_links {
background:red;
width:250px;
color:aqua;
align=LEFT}

#header_spacer {
background:green;
width:200px;
color:Fuchsia}

#header_search{
background:aqua;
width:400px;
color:red;
align:RIGHT}

kleine Probleme noch:
1.) ich hab dem Header die Höhe übergeben und dies dann in der Theorie vererbt an die eingebauten DIV's mit entsprechenden id's.
Mach ich es so, sind die Divs nur Zeilengroß, wie die Texte sind innerhalb der Divs... geb ich den einzelen Div/Id die Height vor, dann klappt es.
Wo ist da noch der Denkfehler?

2.) jetzt sind die Divs noch, wie ich vermutet hab untereinander... wo wird das Float eingebaut. im HTML oder in der CSS? Und wie meinst du das mit aufgehoben?

3.) Ihr dürft mich hauen... ja ich hab immer die # vergessen vor den id, daher wurde das Layout auch nicht umgesetzt... und ich hab immer gedacht, ich mach nen Denkfehler... ne richtig gedacht hab ich schon, nur falsch umgesetzt... und da keine Fehlermeldung wie beim Kompilieren von Programmiersprachen kommen (ja es wird nicht kompiliert sondern interpretiert) ist mir sowas natürlich nicht aufgefallen... mensch steht man auf dem Schlauch.

Ich hoffe, jetzt kann ich mich richtigen css-Problemen widmen... und davon kommen wohl auch noch genug ;-)

Danke üfr eure Hilfe

Hat dir diese Antwort geholfen?

Danke ButtonHilfreiche Antwort Button

Da gibts aber nen Validator für. Der könnte Dir helfen:
http://jigsaw.w3.org/css-validator/

Hat dir diese Antwort geholfen?

Danke ButtonHilfreiche Antwort Button

danke schon mal...

4 Fehler sind noch drin, die mach ich gleich raus.

aber das grundsätzliche Problem wg. den div-Blöcken ist damit noch nicht geklärt.
Hab das Float jetzt noch mal eingebaut... aber das ändert auch nicht wirklich viel... weil der Spacer da noch drin ist... der in den Center müsste... aber nicht geht

und was das float auflösen gemeint ist, ist auch noch nicht klar.

Danke aber bislang

Hat dir diese Antwort geholfen?

Danke ButtonHilfreiche Antwort Button

richtig, div definiert einen block. (p beansprucht z.b. auch eine zeile) dem kannst aber mit

display:inline; abhelfen.
float auflösen ist hier ein schöner link:
http://www.andreas-kalt.de/webdesign/tutorials/float-theorie
funzt wenn unter das letzte floatende div z.b. noch ein div mit clear:both;setzt.
(mag sich für dich stupide lesen, ist aber dafür da um dem browser wirklich .....ensicher mitzuteilen wie man das halt gern hätte)

Hat dir diese Antwort geholfen?

Danke ButtonHilfreiche Antwort Button

so... mal wieder etwas weiter.
Damit ich immer nur ein bisschen Fehler suchen muss für einen Anfänger, mach ich immer nur div für div hintereinander eingefügt ;-)

css:

/*
HTML-Tags-Formatierungen
*/

body{
width:100%;
color:black;
background-color:white;
border:1px;
border-width:thin;
border-style:dashed }

/*
Grundlayouts
*/
#header {
height:70px;
cursor:pointer;
background-color:lime;
border:2px;
border-width:thin;
border-style:dotted}

#breadcrumbs {

height:25px;
cursor:none;
background-color:purple;
border:1px;
border-width:thin;
border-style:groove
}

/*
Elemente innerhalb der Grundlayouts
*/

#header_logo_links {
background:red;
width:250px;
color:aqua;
height:70px;
float:left}

#header_search{
background:aqua;
width:400px;
color:red;
height:70px;
float:right}

/*
allgemeines
*/
#whiteline {
width:100%;
height:2px;
clear:both
}

.text-shadow {
text-shadow: #ffffff 3px 3px 5px
}
und html:
<HTML>
<head>
   <link href="css/css.css" rel="stylesheet" type="text/css">
   </link>

</head>

<body>
   <div id="header">
      <div id="header_and_spacer">
         <div id="header_logo_links">
            <p>hier kommt das LOGO rein</p>
         </div>
         <div id="header_search">
            <p>hier käme später das Suchfeld rein</p>
         </div>
      </div>
   </div>
   <div id=whiteline"></div>
   <div id="breadcrumbs">
      <p>hier kommen dann später die breadcrumbs rein</p>
   </div>
</body>
1. Frage: warum ist die whiteline nicht zu sehen, obwohl die 1, oder in anderen Tests auch mal 2 oder 3 px gross ist.

2.) warum ist der text in breadcrumbs nicht innerhalb vom block / div... sondern bei mir wird er auf der unteren linie vom div angezeigt.

3.) ihr habt mal geschrieben, man muss nicht so verschachteln wie Tabellen... kann man das in diese Beispiel auch schon einhalten?

Danke euch

Hat dir diese Antwort geholfen?

Danke ButtonHilfreiche Antwort Button

1. Frage: warum ist die whiteline nicht zu sehen, obwohl die 1, oder in anderen Tests auch mal 2 oder 3 px gross ist.
Bei sowas mach ich immer das betreffene Element ganz groß und bunt und wenn man es dann immernoch nicht sehen kann, dann schau ich ob ich mich verschrieben habe (oder ein Anführungszeichen vergessen habe oder sowas).


2.) warum ist der text in breadcrumbs nicht innerhalb vom block / div... sondern bei mir wird er auf der unteren linie vom div angezeigt.
das liegt daran, dass der Absatz (<p>) typischerweise mit margin/padding vordefiniert ist. setz mal beides auf 0 p{
margin:0;
padding:0;
}
dann siehts gut aus.


3.) ihr habt mal geschrieben, man muss nicht so verschachteln wie Tabellen... kann man das in diese Beispiel auch schon einhalten?


Das hast Du doch schon ganz gut hinbekommen. Du musst nur alles, was in einem div sein soll auch in dieses div reinschreiben und alles was nicht drin sein soll schreibst Du halt dahinter.

Hat dir diese Antwort geholfen?

Danke ButtonHilfreiche Antwort Button

ok, das mit dem <p> hab ich in der css-Datei mal mit margin:0;padding:0 gefüllt. Jetzt geht's ;-) Danke dafür.

bzgl. der whiteline hab ich die height mal mit 20px oder so gefüllt, mal ohne clear:both, mal mit... egal, was ich mach, es wird nicht angezeigt.

irgendwo hab ich da noch nen Bug drin ;-)

Hat dir diese Antwort geholfen?

Danke ButtonHilfreiche Antwort Button

Wenn das Listing noch so stimmt, dann setze das id whiteline in Anführungsstriche! Das erste fehlt nämlich. ;O)

Dann solle es funktionieren.

gruß saffi

Hat dir diese Antwort geholfen?

Danke ButtonHilfreiche Antwort Button

oh, verzeih. Ich wollte "oder ein Anführungszeichen vergessen oder sowas" eigentlich in Fett schreiben. Habsch dann aber vergessen. ;)


« tabellencode erstellenBrauche DRINGEND! Hilfe bei HomePage »
 

Schnelle Hilfe: Hier nach ähnlichen Fragen und passenden Tipps suchen!

Fremdwörter? Erklärungen im Lexikon!
Directory
Ordner im Dateisystem eines Computers. Siehe auch Ordner ...

Quellcode
Ein Quellcode, auch als Quelltext bekannt, bezeichnet den unkompilierten Programm-Code einer Software. Quell- oder Programm-Code ist der auch für Menschen lesbare Co...

Unicode
Unicode ist ein international anerkannter Standard, der als universeller Zeichencode ("Universal Code") dient und durch das Unicode-Konsortium entwickelt und verwaltet wi...