Hallo!
Ich habe eine Webseite erstellt aber wenn ich die Größe des Browesers verändere, sieht die Websiete anders aus.
Je kleiner ich den Browser anstelle , desto schlimmer siehts aus.
Z.B ein background image mit repeat auf x-Achse, wird völlig entfernt und auch das Menü verstreut sich über den ganze Display.
Vllt. hatte ja schon jemand das Problem.
Übrigens , die Seite ist nur auf meinem PC also nicht im Internet verfügbar. Vllt. liegt es daran und wenn ich die seite ins Netz stelle, sie dann normal aussehen wird?
Ich zähle auf euch !
Danke euch !
Ich habe eine Webseite erstellt aber wenn ich die Größe des
Browesers verändere, sieht die Websiete anders aus.
Was meinst du damit? Du veränderst die Größe des Browserfensters oder nutzt du diese komische Zoomfunktion mit x Prozent?
Je kleiner ich den Browser anstelle , desto schlimmer siehts
aus.
Z.B ein background image mit repeat auf x-Achse, wird völlig
entfernt und auch das Menü verstreut sich über den ganze
Display.
Das ist dann wohl schlecht programmiert.
Vllt. hatte ja schon jemand das Problem.
Vielleicht.
Übrigens , die Seite ist nur auf meinem PC also nicht im
Internet verfügbar. Vllt. liegt es daran und wenn ich die
seite ins Netz stelle, sie dann normal aussehen wird?
Nein, das wird nichts ändern.
Ich zähle auf euch !
Ohne Code kann man dazu nix sagen.
Liquid Design
Ich habe eine Webseite erstellt aber wenn ich die Größe des
Browesers verändere, sieht die Websiete anders aus.
Vielleicht solltest du dich mit diesem zeitgemäßen Ansatz beschäftigen.
Übrigens , die Seite ist nur auf meinem PC also nicht im
Internet verfügbar. Vllt. liegt es daran und wenn ich die
seite ins Netz stelle, sie dann normal aussehen wird?
Nö. Das dürfte dem Browser ziemlich wurscht sein.
Gruß
Stefan
Hallo Stefan!
Ich bin zwar nicht der Fragesteller, aber ich bedanke mich dennoch für Ihren Hinweis mit dem Stichwort „Liquid design“. Ich habe da mal gehulbeet und eine Seite gefunden (und abgespeichert), die mir das Thema näher bringt.
Das finde ich an Foren so schön: egal ob man Fragen ohne Probleme auch mittels einer Suchmaschine lösen und eigentlich keine weitere Hilfe benötigt, so kann man den Lesenden doch auf etwas bringen, an das er überhaupt nicht gedacht hat.
LG und nochmal ein dickes Dankeschön
Michael Vogl
„Was meinst du damit? Du veränderst die Größe des Browserfensters oder nutzt du diese komische Zoomfunktion mit x Prozent?“
Ich meine die ganz normale Größe des Browserfensters.
-
Name
-
Name
-
Name
-
Name
-
Name
-
Name
Text
Text
Text
-
-
-
-
-
-
Hier die CSS:
body{
padding:0;
margin: 0;
}
#wrapper{
margin-top:0px;
width:auto;
height:auto;
}
a img
{
border:none;
margin-right:10px;
}
#header{
padding-top: 10px;
background: -moz-linear-gradient(left, #fff, #d3d3ff);
background: -webkit-gradient(linear, left top, right top, from(#fff), to(#d3d3ff));
width:auto;
height:auto;
margin-left:auto;
margin-right:auto;
}
#img1{
margin-left:26%;
margin-top:0px;
}
#navigator{
width:auto;
height:35px;
background-image:url(images);
background-repeat:repeat-x;
background-color:#bfbff5;
margin: 0;
}
#navigator li {
float:left;
list-style:none;
padding: 0 10px 0 10px;
}
!!! #li1{
margin-left:21%;
}
#navigator a
{
display: block;
float: left;
height: 25px;
font-family:Arial, Helvetica, sans-serif;
font-size: 14px;
color:#00328f;
margin-right:15px;
padding-right:0px;
padding-left:0px;
padding-top:10px;
padding-bottom:0px;
}
#mainmain{
overflow:auto;
width:auto;
height:auto;
background-image:url(image);
background-repeat:repeat-x;
background-color:#b4b4dd;
}
#main{
overflow:auto;
background-color:#f2ebe2;
width:910px;
height:auto;
margin-left:auto;
margin-right:auto;
padding-left:10px;
padding-right:10px;
padding-top:10px;
padding-bottom:10px;
border-left:2px solid #5c5c9e;
border-right:2px solid #5c5c9e;
font-family:Arial, Helvetica, sans-serif;
}
#left2 a{
color:#b60000;
font-weight:bold;
}
#left1 a{
color:#b60000;
font-weight:bold;}
#left1{
float:left;
width:255px;
height:auto;
padding-left:10px;
padding-right:10px;
padding-top:10px;
padding-bottom:10px;
}
#left2{
float:left;
width:254px;
height:640px;
padding-left:10px;
padding-right:10px;
padding-top:10px;
padding-bottom:10px;
border-left:1px solid black;
}
#right{
font-size:15px;
background-image:url(papirus2.png);
background-repeat:no-repeat;
float:right;
width:320px;
height:640px;
padding-left:20px;
padding-right:20px;
padding-top:10px;
padding-bottom:10px;
}
#h2papirus{
margin-top:50px;}
#img2{
margin-right:10px;}
#footer{
background-image:url(image);
background-repeat:repeat-x;
height:70px;
width:auto;
margin: 0;
}
#footer li {
float:left;
list-style:none;
margin-right:10px;
margin-top:20px;
}
!!!#li2{
margin-left:55%;
}
#footer a
{
display: block;
float: left;
height: 12px;
font-family: Arial, Helvetica, sans-serif;
font-size: 11px;
color:#000;
}
Das wars. Würde mich echt freuen wenn ich mir helfen köntet.
Habs rausgefunden.
Ich hatte bei #wrapper width:auto; gehabt.
Wenn ich sie aber auf eine bestimmte anzahl von px verändere wird alles normal, also ich kann dann die Größe so weit verändern wie ich will und es bleibt alles gleich.
Aber jetzt stellt sich andere Frage. Welches Größe soll ich für width nehmen?
Habs jetzt so eingestellt
#wrapper{
margin-top:0px; /* obere weiße Kante */
width:100%;
min-width:1255px;
height:auto;
}
was haltet ihr davon?
was haltet ihr davon?
Nichts.
Du solltest dich im ersten Schritt ein wenig mit der Web-Technologie auseinander setzen.
dein min-width sagt dem Browser, dass der Inhalt mindestens so breit dargestellt werden soll.
Was passiert jetzt, wenn du das Fenster kleiner machst? Es erscheinen die Scrollbalken für vertikales Scrollen. Dies ist bei den meisten Layouts einfach nur schlecht.
Vor Jahren waren 800 Pixel Breite der Standard. Mittlerweile kann man davon ausgehen, dass die meisten Besucher ihr Browserfenster so um die 1000 Pixel breit ziehen.
Um auf der sicheren Seite zu sein, erstelle ich meine Layouts immer so um die 950 Pixel breit. Du weißt ja auch nicht, ob der Besucher nicht evtl. noch irgendeine Browser-Sidebar geöffnet hat, oder so.
Gruß
Torben
Super, danke !
Ich , werde meine Breite wohl auch auf 1000px einstellen.
Super, danke !
Ich , werde meine Breite wohl auch auf 1000px einstellen.
Wie gesagt…
Denk’ dran, dass alle Elemente des Browsers letztendlich Platz wegnehmen.
Die Scrollleiste rechts hat ja auch eine gewisse Breite.
Für den Firefox gibt es ein sehr schönes Addon: Firesizer.
Aaa super, cooles Add-on !
Hast mir sehr geholfen, danke !