DIV Breite festbestimmen

[ullihantke]

Hallo Freunde,

ich lerne gerade css und html 5 programmieren und mache auch große Fortschritte.

Siehe: www.chickenwalkers.de

Nur habe ich folgendes Problem.

Ich habe ein
"Head" (mit Banner usw) ein
"Menü"
"Inhalt"
"Fuss"
"Copyright"

Ich habe das Menü links und den Inhalt daneben gestellt (mit float) leider ist es so, wenn ich sagen mein Menü ist 300px lang und 150px breit, passiert es, dass der Text vom Inhalt nach dem Menü unter das Menü rutscht.!?

Was mache ich falsch?

 

[Myhar]

AW: DIV Breite festbestimmen

Das liegt (unter anderem) daran, dass die Seite nicht sauber programmiert ist. Es gibt, abgesehen von den semantischen Fehlern (Eine Navigation ist keine Überschrift zweiter Ordnung) auch "Fehler" im CSS. Bzw. solltest du dich auch mit der CSS Eigenschaft clear auseinandersetzen. Dann brauchst du deinen einzelnen Elementen keine fixen Höhen und Breiten mehr zuweisen, sondern sie können beliebig wachsen.
Hier ein (soweit ich gesehen habe, gutes) Tutorial, welches dir bei deinem Vorhaben helfen kann.

 

[heLL84]

AW: DIV Breite festbestimmen

Deine Strich Bilder mach die raus und mach diese mit dem <hr> Befehlt oder gib einfach den Menüpunkten einen

border-bottom: 1px solid #000;
und mit Padding-bottom richtest du es aus je nachdem wie weit es nach unten gehen soll und die länge gibste mit an.

Bin selber auch nicht perfekt aber ganz ehrlich würd mich da einfach noch mal ein wenig mit Html & CSS beschäftigen und klein anfangen!

 

[Stone1221]

AW: DIV Breite festbestimmen

Tach auch.Also dein Navigation solltest auf Jeden Fall noch überdenken. Den <h1> bis <h6>
sind nur für Überschriften gedacht. Und soweit ich weiß spricht nichts gegen ein <li> Liste. die du mit css einfach formatieren kannst.Im div Inhaltsberreich kannst du noch ein div anlegen für den content. Oder besser wäre es für das div Inhalt legst du das Attribute <section> an un im <section> Berreich kannst du mit <article> den Content füllen. Für den Fuss berreich gibt es das Attribute <footer>.

UNd für die richtig eingefleischt Webdesigner wennich mit was falsch lag. Sagt mir bescheidt auch ich lerne noch was dazu

 

[patrick_l]

AW: DIV Breite festbestimmen

Das meiste hat Myhar ja bereits erwähnt. Vor allem was die semantischen Fehler angeht. Du solltest deine Website (HTML und CSS) validieren und gezeigte Fehler korrigieren.

- (X)HTML5 validieren
- CSS validieren

- Für die Navigation eine unsortierten Liste (<ul>-Element) verwenden:

<nav id="navigation"> 
    <ul>
        <li><a href="#">Page 1</a></li>
        <li><a href="#">Page 2</a></li>
        <li><a href="#">Page 3</a></li>
    </ul>
</nav>

Das Target-Attribut ist veraltet, in HTML5 nicht gültig und sollte daher z.B. mit JS oder CSS3 gelöst werden. Hier mal mit CSS3.

* {target-new: tab;}

In einem neuen Fenster öffnen ist auch möglich:

* {target-new: window;}

Werde jetzt aber nicht jeden Fehler durchgehen. Das meiste zeigt dir der Validator ja an. Aber so noch ein Tipp. Wenn du mit HTML5 deine Website umsetzt, darfst du auch weitere HTML5-Elemente einsetzen.

Zum Lernen und Nachlesen hier noch ein paar nützliche Links mit hilfreichen Ressourcen. Unter anderem kostenlose Online-Bücher und Beschreibung der einzelnen Elemente in HTML5 (allg. HTML).

- HTML5-Handbuch - Webkompetenz
- Mozilla Developer Network | Lerne HTML, CSS & JS
- Einführung in XHTML, CSS & Webdesign (Michael Jendryschik)
- Little Boxes | Webseiten gestalten - HTML & CSS (Peter Müller)

- Mozilla Developer Network | HTML Elemente
- Mozilla Developer Network | Alphabetische Liste

Oder besser wäre es für das div Inhalt legst du das Attribute <section> an un im <section> Berreich kannst du mit <article> den Content füllen.

Header, nav, menu, section, aside, footer und Co sind keine Attribute sonder Elemente von HTML5. HTML selbst ist eine Auszeichnungssprache zum Strukturieren von Inhalten.

Was jetzt das section-Element angeht. Es handelt sich dabei um ein Element zum Definieren von Abschnitten. "article" ist ja leicht übersetzt. Für das Füllen mit Inhalt (Content) ist es aber nicht notwendig.

Liebe Grüße, Patrick

 

[Myhar]

AW: DIV Breite festbestimmen

Die von Patrick geposteten Links sind ein sehr guter Anfang, kann nur empfehlen, die durchzuarbeiten!

Einen kleinen Fehler hat er jedoch in seiner Aufführung gemacht:

Das Target-Attribut ist veraltet, in HTML5 nicht gültig und sollte daher z.B. mit JS oder CSS3 gelöst werden. Hier mal mit CSS3.

. Es ist weiterhin gültig und kann auch weiterhin verwendet werden. Es war einmal angedacht, dass man es aus der spezifikation nimmt, jedoch hat es seinen Weg zurück gefunden.

 

[patrick_l]

AW: DIV Breite festbestimmen

Es war einmal angedacht, dass man es aus der spezifikation nimmt, jedoch hat es seinen Weg zurück gefunden.

Das ist mir entgangen. Dann danke ich für die Korrektur. Was ich dann jetzt so nicht nachvollziehen kann, warum beim Validieren das target-Attribut als Fehler angezeigt wird.

Liebe Grüße, Patrick

 

[Myhar]

AW: DIV Breite festbestimmen

Welcher validator wird denn verwendet? Mir ist kein HTML5 fähiger Validator bekannt, der auch wirklich alle HTML5 spezifikationen korrekt validiert. Deshalb nie allen Vallidatoren blind vertrauen sondern kontrollieren, ob alle Fehler auch wirklich Fehler sind

 

[patrick_l]

AW: DIV Breite festbestimmen

Welcher validator wird denn verwendet? Mir ist kein HTML5 fähiger Validator bekannt, der auch wirklich alle HTML5 spezifikationen korrekt validiert.

Ich benutze eigentlich nur den Validator vom W3C. Vor kurzem habe ich dann noch den Validator.nu (X)HTML5 Validator entdeckt. Wobei mir der vom W3C immer noch lieber ist.

Deshalb nie allen Vallidatoren blind vertrauen sondern kontrollieren, ob alle Fehler auch wirklich Fehler sind

Da hast du natürlich recht. Schaue mir gefundene Fehler auch immer genau an.

Liebe Grüße, Patrick

 

[Stone1221]

AW: DIV Breite festbestimmen

Hey danke nochmal für die kurze und kleine aufklärung was die Elemente angeht.