beim Minimieren verrutscht alles

Hi leute, also komm ich gleich zur sache.
Die seite die in der Signatur zu sehen ist, bin ich gerade am stylen, das problem ist, wenn man das fenster verkleinert, verutscht alles, ich hab aber keine ahnung wieso..... hoffe ihr könnt mir helfen

Executor

ps: net über die seite wundern, da sind noch einige baustellen ;-)

Executor
 
hmmm, bei welcher größe denn? also ich hab hier grad ne 1024x768 auflösung und da siehts normal aus. bei 800x600 siehts auch noch genauso aus. erst wenn ich das extrem klein mache dann verschiebt sich der text unters menü.

oder willst du, dass die seite immer gleich ist und wenn der browser ne kleinere auflösung hat, dass dann scrollbalken kommen?

also was meinst du genau?
 
Schmeiß mal einpaar codeschnipsel ein. Werd dir diesen dann mal verändern. Dann könnt es funkzen mit der Auflösung und Minimierung.
 
Also ich meinte wenn man das browserfenster kleiner macht (z.b. mit auflösung 1024x768 - dann auf Verkleinern)
HTML - Code is ja da (auf die seite und dann rechtsklick source code anzeigen) und css liegt hier:
Code:
/**
 * template_name Yeminy-STD-Template
 * copyright (C) 2007 by Ole Hoppe and Ulf Gebahrdt
 * This template is inspired by and based on the template on www.jomomla.org (2007)
 */

/*
Farben:
Links: 1b57b1
Text: 000000
Außen: cf4c36
MenüBG: f7f7f7
Button: e5e5e5
*/

/*
Außenrum
*/
body {
   margin: 0px 0px 0px 0px;
	background: #FFF;
	color: #000000;
   font: 10pt 'trebuchet ms', verdana, geneva, lucida, 'lucida grande', arial, helvetica, sans-serif;
}

/*
MainBox
*/
#main {
   /*   margin-left: 30px;
      margin-top: 10px;
      margin-right: 30px;
      margin-bottom: 10px; */
      background:  url(../images/yem_mitte_rechts.png)right repeat-y white;
      height: 100%;
}
/*-----------------style_aussen--------------*/
#leftbox {
  display: inline;
  float: left;
  width: 150px;
  margin-left: 15px;
  margin-top: 5px;
}
#midbox {
  padding-left: 10px;
  float: left;
  width: 68%;
  align: center;
  margin-left: 8px;
}
#rightbox {
  float: right;
  width: 150px;
  margin-top: 5px;
}
#clear {
  clear: both;
}

/*
----------------------------Header-Bereich--------------------------------
*/
#maintop {
	height: 200px;
         width: 100%;
         background: url(../images/yem_header_links.png) top left no-repeat;
}
#maintop_a {
	height: 200px;
         width: 100%;
         background: url(../images/yem_header_mitte.png) repeat-x;
}
#maintop_b {
	height: 200px;
         width: 100%;
         background: url(../images/yem_header_rechts.png) top right no-repeat;
}
#maintop_c {
	height: 200px;
         width: 100%;
         background: url(../images/yem_mitte_links.png) repeat-y;
}
#maintop_ca {
	height: 200px;
         width: 100%;
         background: url(../images/yem_mitte_rechts.png)right repeat-y;
}
/*
--------------------------------------Text-Bereich ----------------------------------
*/
#mainmiddle {
            height:100%;
            width: 100%;
            background: url(../images/yem_mitte_links.png) repeat-y;
}
#mainmiddle_a {
            height:100%;
            width: 100%;
            background: url(../images/yem_mitte_rechts.png)right repeat-y;
}
/*
---------------------------------------Footer-Bereich---------------------------------------
*/
#mainbottom {
	   height:50px;
            width: 100%;
            color: #000;
            background: url(../images/yem_footer_mitte.png)repeat-x;
}
#mainbottom_a {
	   height:50px;
            width: 100%;
            color: #000;
            background: url(../images/yem_footer_rechts.png)right no-repeat;
}
#mainbottom_b {
	   height:50px;
            width: 100%;
            color: #000;
            background: url(../images/yem_footer_links.png)left no-repeat;
}

td {
   padding: 0;
}
table.moduletable {
	/* styling the module table */
	margin: 0px 0px 0px 0px;
	width: 95%;
	}

/*Mainmenu usw -> Überschrift */
table.moduletable th {
         /* styling the module header, and the module titles */
	font-family: Arial, Verdana, Helvetica, sans-serif;
	font-size: 14px;
	font-weight: bold;
	/*text-align: center;*/
	/*text-transform: uppercase;*/
	letter-spacing: 1px;
	color: #000000;
	background: #f7f7f7;
	border-bottom: 1px solid #000000;
	padding: 1px;
	}

table.moduletable td {
		    /* well.. for formatting the table cells of the module table */
		    font-family: Arial, Verdana, Helvetica, sans-serif;
		    font-size: 12px;
}
.button {
	/* this style applies to most form buttons generated by
	   Mambo and its components. Change its format here*/
	color: #000000;
	font-family: Arial, Verdana, Helvetica, sans-serif;
	margin-top: 4px;
	font-weight: normal;
	text-align: center;
	font-size: 12px;
	background: #e5e5e5;
	border: 1px solid #a0a0a0;
	height: 20px;
}
ul#mainlevel {
	    margin: 0px;
	    padding: 0px;
	    list-style: none;
	    padding-top: 3px;
	    margin-left: -8px;
}

ul#mainlevel li {
	       margin: 0px;
	       padding: 0px;
	       font-weight: normal;
	       color: #333333;
	       line-height: 25px;
                margin-bottom: 3px;
                list-style: none;
}

a:link, a:visited {
		 font-size: 12px;
	  	 color: #1b57b1;
                  text-decoration: none;
		 font-family:  Arial, Verdana, Helvetica, sans-serif;
}
 /* Modules */
#rightcol div.module {
  float: right;
  margin-right: 20px;
}
#leftcol div.module {
  margin-left: 7px;
}
#leftcol div.module, #rightcol div.module {
width: 152px;
background: transparent url(../images/yem_menu_mitte.png) left repeat-y;
margin-bottom: 10px;
margin-top: 10px;
}

#leftcol div.module div, #rightcol div.module div {
width: 152px;
background: transparent url(../images/yem_menu_oben.png) top left no-repeat;
}

#leftcol div.module div div, #rightcol div.module div div {
width: 152px;
background: transparent url(../images/yem_menu_unten.png)  bottom left no-repeat;
}

#leftcol div.module div div div,#rightcol div.module div div div{
width: 137px;
padding-left: 5px;
padding-right: 10px;
/*padding-top: 1px;*/
background: transparent;
padding-bottom: 10px;
font-size: 10px;
}

#leftcol div.module div div div div, #rightcol div.module div div div div{
padding: 0px;
margin: 0px;
}
 
Also ich hab mal den Code durchgeforstet und ich kann kein fehler entdecken. X(

@lightsaver:
hmmm, wie gesagt, bei mir wird das korrekt angezeigt bis zu fenstergrößen, die sich eh niemand antun würde
Ist bei mir genausot. Auf was für ne größe willst du es denn haben?
 
Beim Entwurf eines Designs muss man sich von vornherein auf eine bestimmte Mindestauflösung festlegen oder sich für ein Design entscheiden welches entsprechend variabel ist. Deines ist nicht derartig variabel, da du 3 Spalten per float nebeneinander positionierst. Einzige Lösung um das Verschieben zu verhindern wäre um die 3 floatenden <div>s herum ein <div> mit einer festen Breite zu setzen. Fehlerhaft ist bei dir ansonsten nichts, nur nicht ganz durchdacht ;)
 
ok danke sehr!^^

Also das kein Fehler im Code ist, is ja schonmal gut ;-)

Ich werd mal auf Zwirnis Vorschlag eingehen xD danke sehr!

Executor
 
Zurück
Oben