Vollständige Version anzeigen : [CSS] Webseite breit und höhe


»The Gr4ndp4
08.03.2012, 21:07

Hey,

ich möchte eine Webseite machen, nun wiss ich nicht, ob ich die breite/höhe der einzelnen Div containern lieber in % oder in px angebe. Wenn ich sie in px angebe, ist es halt blöd, da kann ich es doch nur richtig für eine Auflösung anpassen, oder ?

Wenn ich die Breite in % angebe, dann verschiebt sich das auch alles so blöd :D

Wie mache ich das am besten, das ich es akzeptabel für verschiedene Auflösungen mache ?


Nanobyte
08.03.2012, 21:11

Warum willst du überhaupt eine Angabe machen?
Sollen die Divs alle die gleiche höhe haben?

Am besten du machst uns eine grobe/verständliche Zeichnung von deinem vorhaben.


»The Gr4ndp4
08.03.2012, 21:19

Ähnliche Themen: [CSS] Webseite breit und höhe Hey, ich möchte eine Webseite machen, nun wiss ich nicht, ob ich die breite/höhe der einzelnen Div containern lieber in % oder in px ang[...]
Durch hohe Nachfrage und begrenztes Angebot - Auch 2006 hohe Strompreise Link: (_de-news-yahoo-com/07012006/3/diesem-jahr-entwarnung-strompreisen-html) Wie der Chefredakteur des Energie-Informationsdienstes EID, [...]
[CSS] Webseite breit und höhe
will halt das meine seite aus meheren container besteht.

hier mal nen kleines beispiel

Download: Unbenannt-png | _-xup-in (__-xup-in/dl,10645976/Unbenannt-png/)


Fu$$el
08.03.2012, 21:47

haupt div container würde ich ne fixe breite vorgeben und center setzen. (<1000px)
ansonsten würde sich die seite ganz schon ziehen bei 1920x1200_.


dreamax
09.03.2012, 14:38

Naja du kannst ja den Haupt-Div auf eine Breite von 80% einstellen und durch die Angabe von min-width: 900px; verhindern das die Seite zu schmal wird. Dann setzt du noch die Höhe des Logos auf einen festen Pixelwert um zu verhindern das etwas abgeschnitten wird.


Fu$$el
09.03.2012, 16:26

Naja du kannst ja den Haupt-Div auf eine Breite von 80% einstellen und durch die Angabe von min-width: 900px; verhindern das die Seite zu schmal wird. Dann setzt du noch die Höhe des Logos auf einen festen Pixelwert um zu verhindern das etwas abgeschnitten wird_

dann müsste er aber noch ein max-width definieren. ansonsten könnte es bei z_b. 1920x1200 alles zu lang gezogen werden.

als anfänger (was er glaubig ist) würde ich ihm eine fixe breite empfehlen. für den einstieg ist es einfacher und man kann nicht soviele fehler machen_.


»The Gr4ndp4
09.03.2012, 17:35

Danke euch, die funktionen max-width und min-width sind eig das was ich gesucht habe :)

//

Wie bekomme ich die Bildschirmauflösung eines Besuchers heraus?
Geht das mit php ? Das ich dann für die gängisten Auflösung eine extra -css datei mache und die je nach Auflösung geladen wird ?


Mr. Mouse
10.03.2012, 00:55

Danke euch, die funktionen max-width und min-width sind eig das was ich gesucht habe :)

//

Wie bekomme ich die Bildschirmauflösung eines Besuchers heraus?
Geht das mit php ? Das ich dann für die gängisten Auflösung eine extra -css datei mache und die je nach Auflösung geladen wird ?

sollte mit javascript machbar sein ;)

php wird serverseitig ausgeführt und kann sowas daher nicht auslesen.


Nanobyte
10.03.2012, 01:40

Bevor du jetzt anfängst mehrere CSS-Datei zu erstellen guck dir lieber css media query an.
Damit lässt sich direkt mit CSS auf unterschiedliche Größen Reagieren.

Hier eine Super Demo von Chris Coyier
(Einfach beim ändern der Seitenbreite auf die "EMail"-Adressen achten_)
CSS Media Queries Sidebar (_css-tricks-com/examples/MediaQueriesSidebar/)

_css-tricks-com/css-media-queries/

CSS3 Media query layout example | Max Design (__-maxdesign-com-au/articles/css3-media-queries/media-sample/)


Terrorbeat
10.03.2012, 07:31

Also Fixe werte sind meiner Meinung nach immer besser da Prozentangaben bei Handys und ähnlichem klein Vieh doch sehr gequetscht aussieht.


Murdoc
10.03.2012, 08:21

bei handys und ähnlichem kleinvieh nutzt man auch separate css-files ohne angegebene breite/höhe (je nach orientation) und nutzt immer 100% von dem was verfügbar ist :)

als fixer wert hat sich 980px eingebürgert. das sind bei 1024px breite dann 980px + scrollbar (~20px die du einberechnen musst). insg. solltest du nicht über 1000px hinausaus gehen, dann passt es.

wenn du dein design aber auch für höhere auslösungen anbieten möchtest, dann kannst du mit media-queries arbeiten (wie nanobyte oben erwähnt hat).

aber beachte hierbei folgendes:
umso breiter deine seite ist, desto mehr müssen die augen beim lesen von texten wandern.
die grenze des erträglichen liegt so bei 800px breite bei 10pt schriftgröße (für mein empfinden).

hier empfiehlt sich die verwendung von css3-columns:
Using CSS multi-column layouts - Web developer guide | MDN (_developer-mozilla-org/en/CSS3_Columns)




raid-rush.ws | Imprint & Contact pr