|
|||
Brauche Hilfe für Design
Hallo Gemeinde!
Ich möchte eine neue Website erstellen, welche sich an jede Browsergröße anpassen soll. Hier ein Beispiel wie es aussehen soll: Erklärung: DIV links: Feste Breite, aber flexible Höhe DIV mitte: Flexible Höhe und flexible Breite DIV rechts-oben: Feste Breite und Feste Höhe DIV rechts-mitte: Feste Breite aber flexible Höhe DIV rechts-unten: Feste Breite und Feste Höhe DIV mitte-unten: Feste Höhe aber flexible Breite Kann mir da mal jemand Helfen? Mit Tabellen wäre das schnell gelöst, aber is halt ein veraltetes System... Vielen Dank auf jeden Fall im Vorhinein! LG, Machomaaan |
Sponsored Links |
|
|||
Zitat:
Für besonders kleine oder große Größen eignen sich vielmehr spezialisierte Stylesheets, die mit Hilfe von Media Queries angewendet werden. Komplexe Layouts wie dieses zeigen auf kleinen Ausgabegeräten ihre Starrheit. Zitat:
Ich bezweifle, dass das Nutzen der tabellaren Darstellung hier besonders effizient wäre. Zudem sind weder Tabellen noch tabellarische Darstellung in irgendeiner Art und Weise veraltet. Wenn du allerdings der Meinung bist, dass Tabellen nicht mehr zur Darstellung nicht-tabellarischer Daten genutzt werden sollten, hast du nur bedingt Recht: Das hätte nie der Fall sein dürfen. Leider hast du ein paar Angaben vergessen: Soll das Gesamtkonstrukt 100% Höhe und Breite des Anzeigebereichs einnehmen und daher nur der Mittelteil scrollbar sein? Oder soll stattdessen das Gesamtkonstrukt mit dem Inhalt von mitte-oben wachsen, so dass die unteren Bereiche erscrollt werden müssen, während der Mittelteil immer genug Platz für seine Inhalte hat? Beides ist nur mit exzessivem Einsatz von absoluter Positionierung möglich und daher sehr fragil.
__________________
Über Internet Explorer 8: Noch bis 8. April 2014 wird der Internet Explorer 6 mit Sicherheitsupdates versorgt. Bereits jetzt kann dieser Browser aber vollständig durch den IE8 ersetzt werden. Ältere Betriebssysteme und Browserversionen werden von Microsoft nicht mehr unterstützt. Auch Programme, die den IE7 benötigen, sind kein Argument gegen IE8, da dieser über entsprechende Kompatibilitätsschichten verfügt. Ab sofort gilt daher der Internet Explorer 8 als vorausgesetzer Mindeststandard. |
Sponsored Links |
|
|||
Hallo gato,
vielen Dank erstmal für deine Antwort! Ich habe noch nie mit Media Queries gearbeitet. So sollte der Hintergrund letztendlich aussehen: Wie realisiere ich das am Besten, damit es bei allen Browsern möglichst gleich aussieht? Momentan ist diese Seite 800px Breit und ist Mittig-Oben ausgerichtet! Wenn man allerdings einen rießigen Bildschirm mit hoher Auflösung hat, dann sieht das überhaupt nicht gut aus LG |
|
|||
Hm, das ist schon was ganz anderes, als du zuerst beschrieben hast.
Zitat:
Die seitlichen Schattierungen kannst du mit einem zentrierten Hintergrundbild lösen. Die Aufteilung zwischen Inhaltsbereich und Seitenstreifen sollte mit Faux Columns lösbar sein (siehe FAQ). Der Footer sollte mit "Footer Stick Alt" (siehe ebenfalls FAQ) lösbar sein. Bedenke, dass der Footer durchaus die volle Breite einnehmen darf. Überschneidungen verhinderst du, indem du seitliche Außenabstände nutzt. Wenn dir diese Art des Arbeitens noch Schwierigkeiten bereitet, rate ich, ein Standardwerk wie Little Boxes durchzuarbeiten um eine solide Grundlage zu erhalten. |
|
|||
Zitat:
Du könntest dem umfassenden Div statt starrer 800px, eine variable Breite geben, zb so: #wrapper { width: 60em; min-width: 700px; max-width: 95%; } Damit hättest du ein Layout, was bei vielen Browserbreiten gut aussieht. Der Nachteil wäre aber, dass du den Tipp von gato Zitat:
LG Netinja |
|
|||
Hallo Leute!
Vielen Dank für eure Tipps und Infos! Ich wollte jetzt mal die Seite einfach etwas Breiter machen (1000px) und in der Höhe variable! Das mit der Höhe, und damit der Footer immer am Boden bleibt habe ich mit einem Wrapper gelöst! Die rechte Spalte wird jedoch mittels float:right rechts im Container ausgerichtet und wenn der text in einen der Divs im rechten DIV länger ist, dann fährt das irgendwann hinter dem Footer nach unten vorbei. Ich bin echt am verzweifeln. Kann mir jemand mal ein einfaches Grundgerüst erstellen? Vielen Dank im Vorhinein. |
|
|||
Zitat:
Alternativ kannst du dich gleich darüber schlau machen, wie float und clear funktionieren, da liegt nämlich aller Wahrscheinlichkeit der Hund begraben |
|
|||
Hallo!
Also hier das Design. Das Float wieder beenden habe ich auch an diversen Stellen versucht, ändert sich aber nichts! Vielleicht kannst du mir auch noch sagen, wie ich den Text im Footer unten zentriert im schwarzen Bereich hinbekomme? Wenn ich ein Margin in der Breite des rechten orangenen Bildes eingebe, funktioniert es nicht? Und im Allgemeinen, passt du Struktur der CSS Datei? Bei der ersten Seite habe ich extrem viele DIV's verwendet und für jeden Style praktisch ein eigenes DIV angelegt -> Was ja kompletter Unsinn ist, denke ich mal Danke auf jeden Fall schon einmal. |
|
|||
Warum denn nicht gleich so
Zitat:
Zitat:
Wenn ich bei #footer die Angabe zu width weglasse (da unnötig) und padding-right: 280px; festlege, kann ich auch die Inhalte von #footer zentrieren. Zitat:
div-Elemente haben nichts mit CSS zu tun Für den Anfang ist das HTML-Gerüst schon brauchbar. Wenn du mehr Erfahrung hast, wird sich die Zahl der div-Elemente und der IDs und Klassen noch weiter verringern. Du solltest dich aktuell noch mehr mit den Grundlagen beschäftigen. Dein Quelltext insgesamt ist noch recht aufgebläht (zahlreiche meta-Elemente die keine Auswirkung haben) und etwas fehlerhaft. Nutze den Validator. Da sich deine Seite im Aufbau befindet solltest du in der Dokumenttypangabe die Variante Strict anstatt Transitional verwenden (oder gleich den HTML5-Doctype verwenden). meta- und link-Elemente solltest du selbstschließend notieren, z.B. HTML-Code:
<meta http-equiv="content-type" content="text/html; charset=utf-8"/> <!-- anstelle: --> <meta http-equiv="content-type" content="text/html; charset=utf-8"></meta> |
Sponsored Links |
|
|||
Hey Gato!
Vielen Dank für die Tipps und Infos! Werde es heute Abend gleich mal ausprobieren. Vielen Dank auch für die Tipps mit den Meta-Tags! Besten Dank und ich melde mich wieder, wenns was News gibt LG |
Sponsored Links |
Themen-Optionen | |
Ansicht | |
|
|
Ähnliche Themen | ||||
Thema | Autor | Forum | Antworten | Letzter Beitrag |
Brauche Hilfe, Tabelle + CSS | D3r-Tot | (X)HTML | 3 | 02.08.2010 16:43 |
Brauche hilfe zu vhost.conf bei einem Apache debian vServer | onkel-tom | Serveradministration und serverseitige Scripte | 5 | 16.11.2008 13:42 |
HILFE, ich brauche Hilfe von Profis! | frambuesa | CSS | 13 | 13.06.2008 23:46 |
brauche hilfe bei design | hyperterminal | CSS | 10 | 10.03.2005 16:11 |