WebWork Magazin - Webseiten erstellen lassen, Online Medien, html

Webhoster, Webhosting Provider und Domain registrieren

Home | Registrieren | Einloggen | Suchen | Aktuelles | GSL-Webservice | Suleitec Webhosting
Reparatur-Forum | Elektro forum | Ersatzteilshop Haushalt und Elektronik



Im Homepage und Webhosting-Forum --- von frames zu gutem XHTML - unbewegliches Menue und Banner

HTML, XHTML, CSS , style, XML, Javascript und mehr, Fragen, Tipps und Anregungen zu diesen Basic Techniken - hier rein !

Forum » HTML, CSS - Hilfe für das Erstellen einer Homepage » von frames zu gutem XH... - 20 Mai 2024 Antworten
im Forum für Webhosting Homepage gefunden:
von frames zu gutem XHTML - unbewegliches Menue und Banner
Gon
Otto-Normal-Poster
Threadstarter




Beiträge: 72

Ich versuche gerade eine alte Seite umzustellen von Frameset und Tabellen auf einen schöneren Stil, XHTML und CSS, fein säuberlich getrennt...
Ich versuch mir dass ja, seit ich hier registriert bin, Stück für Stück beizubringen.


Auf der alten Seite gab es am oberen Rand ein Banner was sich aus drei Teilen zusammensetzte, der Ecke (links oben), dem Hauptteil mit Schriftzug und dem restteil, das sich so weit ausstreckte wie das Browserfenster breit war.
Dann gab es links ein Menü über das die Navigation auf der Seite lief und den Inhaltsframe, in dem angezeigt wurde, was der User sehen/lesen wollte.

Nun hab ich alle Inhalte in divs gruppiert
(div Banner) (div navi) (div container)
und versuche jetzt die einzelnen via css zu positionieren und gestalten. Bisher habe ich noch keine Möglichkeit gefunden, einzelne Elemente absolut zu positionieren in Bezug auf das Fenster, nicht in Bezug auf die Seite. bei position_absolute wird es ja rgendwo auf die Seite genagelt, ich möchte aber, dass Banner und Navi immer links am Rand und oben an der Decke kleben und nur der Inhalt sich bewegt, wenn man scrollt.
Der Text des Inhalts soll erst unterhalb des Banners anfangen, würde aber beim Runterscrollen hinter den Banner verschwinden.

ich versuch mich mal mit ner Ascii Zeichnung wie's aussehen soll


1: 
2: 
3: 
4: 
5: 
6: 
7: 
8: 
9: 
10: 
11:
BBBBBBBBBBBBBBBBBBBBBbbbbbbbbbbbbbbb|
BBBBBBBBBBBBBBBBBBBBBbbbbbbbbbbbbbbb|
NNNN  TTT<    h1    >TTTTTTT        |
NNNN  TTTTTTTTTTTTTTTTTTTTTT        |
NNNN  TTTTTTTTTTTTTTTTTTTTTT        |
NNNN  TT< h2 >TTTTTTTTTTTTTT        |
NNNN  TTTTTTTTTTTTTTTTTTTTTT        |
|     TTTTTTTTTTTTTTTTTTTTTT        |
|     TT< h2 >TTTTTTTTTTTTTT        |
|     TTTTTTTTTTTTTTTTTTTTTT        |
|___________________________________|



B = Banner
b = bannerfüller bis Seitenende
N = Navigationsmenü
T = Inhat, text, Bilder etc

sollen einfach nur Überschriften sein, sind an sich egal für das layout ^^



Wie bekomme ich Banner und Navi dazu, "über den Dingen zu stehen" und dort oben zu schweben während der Rest normal gescrollt wird.
Lässt sich das XHTML-valide realisieren oder nicht?

*edit*
ich hab mal weitergesucht und alle Lösungen die ich fand basierten auf Javascript und einer scrolltop() Funktion. Gibt es keine andere Möglichkeit? Falls nein, müsste ich wohl zukünftig auf dieses "Schmankerl" verzichten.
*/edit*


Danke für alle konstruktiven Antworten. ^^


---
'Never imagine yourself not to be otherwise than what it might appear to others that what you were or might have been was not otherwise than what you had been would have appeared to them to be otherwise.'
(the Duchess)


Diese Nachricht wurde geändert von: Gon
  Profil   Editieren   Zitieren
subjective
Forenheld




Beiträge: 844

XHTML-kompatibel ja, aber der IE kann kein position:fixed. Somit müßte man die Fixierung per JS machen, was wiederum nicht sehr schön wäre. Warum soll eigentlich der Header/die Navi nicht einfach mit der Seite scrollen?

---
Weaverslave

  Profil   Website   Editieren   Zitieren
HoRnominatoR
Mausakrobat




Beiträge: 161


  Profil   E-Mail   Website   Editieren   Zitieren
Gon
Otto-Normal-Poster
Threadstarter




Beiträge: 72

k, danke. Ich werd damit mal rumspielen, wenn ich wieder an meinem Rechner bin. ^^
Aber wenn es nicht auf dem IE geht, ist das unangenehm, da ich denke viele IE Nutzer bei uns zu haben.


Warum es nicht mitscrollen soll? Bisher ist es so, dass Banner und Navigation eine Art Rahmen bilden und der Inhalt wie in einem Kasten hängt und sich nur "innerhalb" dieses Kastens bewegen soll.
Es hat nur stylische Gründe und wird deshalb weggelassen wenn es sich nicht realisieren lässt. War nur ne Spielerei. Dann muss ich meinen Hobby Grafiker nur bitten ein bissl was zu ändern dann geht das wieder und scrollt halt (leider) mit.

---
'Never imagine yourself not to be otherwise than what it might appear to others that what you were or might have been was not otherwise than what you had been would have appeared to them to be otherwise.'
(the Duchess)

  Profil   Editieren   Zitieren
Gon
Otto-Normal-Poster
Threadstarter




Beiträge: 72

HoRnominatoR schrieb am 14.07.2005 18:59
nicht schoen, aber hilfreich

http://www.fabrice-pascal.de/artikel/posfixedie6/

siehe http://rammstein.de


nicht schön?
Versteh mich nicht falsch aber das ist sogar äusserst unschön.
Ich hab eben mal meine Browsergröße hin und her verändert (IE weil auf arbeit) und die Seite sah plötzlich total vermurkst aus. Hab zu erst nur die Breite verringert und das Layout sprang um auf ein grafikarmes Layout. Sehr gut gelöst, sah schön aus. Dann änderte ich die Höhe und... naja, soddom und gomorra...
Das Banner fehlte völlig, die Navigation war hin und unten war ein riesiger Block leeren Raumes in dem man nur den Hintergrund betrachten konnte. Der scrollbare Text hingegen war um genau diesen Block nach oben verschoben was bedeutete das SOWOHL Text als auch der Scrollbalken ausserhalb meines Browsers landeten, oben, wo man halt net mehr hinkommt...

Ich hab eben probiert den Fehler zu rekonstruieren, ging nicht, aber dass so etwas passieren kann lässt mich arg zweifeln ob ich sowas überhaupt möchte...

---
'Never imagine yourself not to be otherwise than what it might appear to others that what you were or might have been was not otherwise than what you had been would have appeared to them to be otherwise.'
(the Duchess)

  Profil   Editieren   Zitieren
HoRnominatoR
Mausakrobat




Beiträge: 161

ich meinte das eher aus technischer sicht, da es auf hacks beruht, was immer unguenstig ist, da nut eine temporaere loesung, in naechsten generationen muss das schon nichtmehr gehen.

rammstein ist auch nur ein bspl, ob dort auch genau das angewandt wurde, kann ich dir nichtmal sagen, aber die variante von fabrice pascal sollte funktionieren oder mindestens anpassbar sein.

---
get OPERA for free

  Profil   E-Mail   Website   Editieren   Zitieren
Gon
Otto-Normal-Poster
Threadstarter




Beiträge: 72

ich war gestern noch mit einem anderen Problem beschäftigt, ich werd wohl heute ein bissl damit rumspielen.

---
'Never imagine yourself not to be otherwise than what it might appear to others that what you were or might have been was not otherwise than what you had been would have appeared to them to be otherwise.'
(the Duchess)

  Profil   Editieren   Zitieren
Austin Powers
Mausakrobat




Beiträge: 169

Wie wärs mit überfüllten tags?
Die würden dan wie ein Iframe (mit eigener scrolleiste) wirken.

---
MfG:Austin Power (Saturn Realm)
OMW! Zumindest sobald ich herausgefunden hab wo ich JETZT gerade bin.
<---------->
"Wenn Liebe die Antwort ist, könnst Du bitte die Frage neu formulieren?" ... Lily Tomlin
<---------->
code hier http://www.pastebin.com

  Profil   Website   Editieren   Zitieren
Ehemaliges Mitglied (#1460)
Posting-Schinder




Beiträge: 609

Gon schrieb am 14.07.2005 13:59
Nun hab ich alle Inhalte in divs gruppiert
(div Banner) (div navi) (div container)

Nachdem ich Deinen Code nicht kenne, aber weiß, dass Du Dich als CSS-Anfänger bezeichnest, wage ich mal diesen Kommentar; wenn er nicht zutreffend ist, dann bitte ich, deswegen nicht böse zu werden:

Ich hoffe, Du hast mit
s nicht INHALTE gruppiert, sondern nur ELEMENTE (HTML-Tags). Denn INHALTE sollst Du AUSZEICHNEN mit semantisch richtigen Tags! Ein Banner dient z.B. meist als Überschrift. Das in ein
zu packen ist sinnfrei. Es gehört in ein

, weil es die Überschrift 1. Ordnung dieser Seite ist.
Eine Navigation besteht eigentlich immer aus einer Liste (meinst
    ), nicht aus einem
    . Wenn Du nicht noch andere Tags mit Inhalten hast, die sich mit dieser Liste zusammen irgendwie verhalten sollen, dann ist es sinnfrei, ein
    um die
      zu legen. Wenn Du nur ein Element hast, hast Du nichts, was Du gruppieren kannst. Alles, was Du dem
      an Eigenschaften zuweist, kannst Du auch dem
        zuweisen, beides sind Block-Elemente.

        Alles andere führt zu div-Suppe, die semantisch keinen Deut besser ist als Tabellenmissbrauch.

        Bisher habe ich noch keine Möglichkeit gefunden, einzelne Elemente absolut zu positionieren in Bezug auf das Fenster, [...] ich möchte aber, dass Banner und Navi immer links am Rand und oben an der Decke kleben und nur der Inhalt sich bewegt, wenn man scrollt.

        Dass das Probleme bei alten Browsern macht, hat man Dir ja schon nahegelegt. Aber ich würde vorschlagen, zu überdenken, ob das überhaupt nötig ist. Das ist schließlich ein nicht normales Verhalten von Websites, der Nutzer erwartet normalerweise eine scrollende Seite. Warum also muss da irgendwas feststehen. Es ist nicht nötig, und es ist auch nicht wirklich schöner. Es verkleinert vor allem nur den zur Verfügung stehenden Platz im Browserfenster, was für den Nutzer immer ein Nachteil ist.

        Alternativ zu den hier gemachten Vorschlägen könntest Du aber auch Deinem Content eine feste Größe geben und mit overflow:auto arbeiten. Problem dabei, Du weißt nicht, wie hoch der Content sein kann, da Du nicht 100% - rechnen kannst.

        sollen einfach nur Überschriften sein, sind an sich egal für das layout


        Egal ist gar nichts. Einem CSS-Layout muss immer ein guter HTML-Code mit guter Struktur (Semantik) zugrunde liegen, sonst geht gar nichts.
        Aber ich weiß schon, wie Du das hier gemeint hast

        Wie bekomme ich Banner und Navi dazu, "über den Dingen zu stehen" und dort oben zu schweben während der Rest normal gescrollt wird.
        Lässt sich das XHTML-valide realisieren oder nicht?

        Mit XHTML hat das nichts zu tun, denn es geht ja hier um das Layout. Und das ist nur CSS.
        Du wirst sagen "Jaja, das meinte ich ja", aber anhand von anderen CSS-Anfängern ist meine Erfahrung, dass korrekte Ausdrucksweise das Leben ungeheuer erleichtert. Viele schmeißen diese Begriffe immer noch durcheinander und wenden sie dann auch falsch an, vermischen Inhalt und Layout, und machen sich dadurch das Leben unnötig schwer. Es ist aber bei validem XHTML, Semantik und CSS-Layout einfach wichtig, alles richtig zu machen und nicht zu "schludern".

        Gibt es keine andere Möglichkeit? (JavaScript) Falls nein, müsste ich wohl zukünftig auf dieses "Schmankerl" verzichten.

        Es ist in Wahrheit kein Schmankerl. Die Nutzer finden es zunehmend lästig. Ich würde darauf verzichten.

        Gruß,
        -Efchen

  Profil   Editieren   Zitieren
Gon
Otto-Normal-Poster
Threadstarter




Beiträge: 72

Danke für den Beitrag und ich nehm dir nichts übel. Ich betone ja, dass ich Anfänger bin, damit ich deutliche Erklärungen bekomme und nicht davon ausgegangen wird, dass ich alles wüsste.
Wobei es derzeit wohl noch stark mangelt ist die richtige Ausdrucksweise. ^^
Nun hab ich alle Inhalte in divs gruppiert
(div Banner) (div navi) (div container)

war die lachse ausdrucksweise für
Ich habe zB einen
  Profil   Editieren   Zitieren
Ehemaliges Mitglied (#1460)
Posting-Schinder




Beiträge: 609

Gon schrieb am 20.07.2005 13:40
1: 
2: 
3: 
4:
      

Decker und Hacker

Was sind Decker, was sind Hacker, was unterscheidet sie. Langer Text, viel Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua.

wäre das ein vernünftiger Gebrauch von Divs?

Ja, die
s sind okay. Nur die s hier nicht
Da kommt ein

hin, denn es handelt sich um einen Textabsatz. Ob Du zusätzlich noch ein brauchst, für optische Effekte, ist natürlich denkbar.

Das mit dem hab ich von einer Seite eines Bekannten, der sich WebDesigner schimpft. Ist das wirklich sinnvoll/notwendig oder nur wenn es direkt gebraucht wird zu verwenden?

In diesem Beispiel ist es - wie gesat - eine semantische Katastrophe.


  Profil   Editieren   Zitieren
 

Antworten
Forum » HTML, CSS - Hilfe für das Erstellen einer Homepage » von frames zu gutem XH...

Aktuelle Beiträge zur Hilfe im Forum für Homepage - von frames zu gutem XHTML - unbewegliches Menue und Banner im Forum Homepage Hosting AntwortenLetztes Posting
Unvorhersehbare Layout-Verschiebungen auf meiner Seite - Ideen?
in "HTML, CSS - Hilfe für das Erstellen einer Homepage"
0 20.08.2023 20:14 von Freud
Geschenkidee zum Geburtstag
in "HTML, CSS - Hilfe für das Erstellen einer Homepage"
2 14.04.2022 16:08 von bryleth03
Webdesigner gesucht
in "HTML, CSS - Hilfe für das Erstellen einer Homepage"
2 10.12.2021 15:04 von Rieke
Welcher Hoster ist der Beste?
in "HTML, CSS - Hilfe für das Erstellen einer Homepage"
1 10.12.2021 15:02 von Rieke
Warum Wordpress?
in "HTML, CSS - Hilfe für das Erstellen einer Homepage"
6 05.07.2021 18:27 von Rieke
Die Idee einen Blog zu führen
in "HTML, CSS - Hilfe für das Erstellen einer Homepage"
2 27.02.2021 09:50 von Samira2021
zu viele css dateien?!
in "HTML, CSS - Hilfe für das Erstellen einer Homepage"
4 19.01.2021 19:20 von Laurena
WIe kann ich Datum ausblenden?
in "HTML, CSS - Hilfe für das Erstellen einer Homepage"
1 23.11.2020 12:21 von noahradar96
Tabelle mit Mannschaftslogos
in "HTML, CSS - Hilfe für das Erstellen einer Homepage"
3 23.10.2019 14:54 von andyy
Eigene Website erstellen - kostenlos!
in "HTML, CSS - Hilfe für das Erstellen einer Homepage"
0 17.05.2019 15:01 von Fusselchen



Besucher : 7995836    Heute : 198     Gestern : 411     Online : 17     20.5.2024    5:00      1 Besucher in den letzten 60 Sekunden        
alle 60.00 Sekunden ein neuer Besucher
Nach oben