Seite 2 von 2

Verfasst: Di 7. Jun 2005, 13:51
von Pillendreher
ja aber wie bekomm ich es denn hin, dass die boxen dann genau an der stelle sind wo ich sie haben will?

Verfasst: Di 7. Jun 2005, 14:36
von Pillendreher
Craxx wunderbesten dank...

www.zeimke.com/hoebrink/hoebrink.html

aber zwei fragen habe ich noch....
wie regel ich es, dass ich von der Navigation z.B. direkt in den <div id="inhalt"> verlinke, so dass die seite nciht immer neu geladen werden muss, sondern nur der "frame" ?

und irgendwie wird die seite zu lang..... nach unten hin, obwohl dort gar kein inhalt mehr sein sollte.... wie kann ich das hinbekommen?

Code: Alles auswählen

html,body {
 text-align:center;
 margin: 0;
 padding: 0;
}
#redstripe {
   	width:100%;
         margin:30px,0px,0px,0px;
         padding:0px;
         position:relative;
         height:70px;
         background-color:#F79393;
}

#center_me {
 text-align: left;
 width: 780px;
 margin: 0 auto;
}

#oben {
   background-color: #CD0000;
	margin:0px,0px,0px,0px;
	width: 780px;
         height:88px;
         position:relative;
         text-align:left;
         color:#E9DDDD;
         font-family: Verdana, Geneva, Arial, Helvetica, sans-serif;
         font-size:25px;

}
#grau {
	background-color: #E9DDDD;
         bottom:0px;
         right:0px;
	width:622px;
	height:20px;
         position:absolute;
         text-align:right;
         font-size:14px;
         font-weight:bold;
	color:#CD0000;
         font-family: Verdana, Geneva, Arial, Helvetica, sans-serif;
}
#bgcontent{
	background-color: #CD0000;
	bottom:0px;
         height:83%;
	width: 780px;
         position:relative;
}
#left {
   background-color: #E9DDDD;
         top:0px;
         left: 0px;
	width: 158px;
	height:470px;
         position:absolute;
         text-align:left;
         font-size:12px;
   color:#CD0000;
         font-family: Verdana, Geneva, Arial, Helvetica, sans-serif;
}

#inhalt {
   background-color: #ffffff;
         top:0px;
         left: 158px;
	width:460px;
	height:470px;
	position:absolute;
         text-align:left;
         padding:5px;
         overflow:auto;
   	font-weight:bold;
         font-size:12px;
   	color:#CD0000;
         font-family: Verdana, Geneva, Arial, Helvetica, sans-serif;
}

#rightwhite {
	background-color: #ffffff;
	position:absolute;
         top:0px;
         left:618px;
   	width: 162px;
   	height:20px;
         text-align:left;
         font-weight:bold;
   	color:#CD0000;
         font-family: Verdana, Geneva, Arial, Helvetica, sans-serif;
}

#right {
	background-color: #E9DDDD;
	position:absolute;
	top:40px;
	left: 618px;
	width: 162px;
	height:430px;
	text-align:left;
	font-weight:bold;
	color:#CD0000;
	font-family: Verdana, Geneva, Arial, Helvetica, sans-serif;
}
dangge schon im voraus

Verfasst: Di 7. Jun 2005, 15:24
von i-fekt
Dein Topic heißt ja "barrierefrei...". Da musst du die Seite immer neu laden, Frames sind nicht Barrierefrei. Ausserdem reicht es, die font-family 1x in html, body im CSS anzugeben. Die Schriftgröße darf nicht mit px angegeben werden, sondern mit % oder em.

Mach mal ein DIV um alles! Also nach <body> und vor </body>. Diesem richten wir dann zentriert aus.

Verfasst: Di 7. Jun 2005, 21:54
von Pillendreher
Craxx vielen Dank! Du hast mir die augen quasi geöffnet.

zu sehen ist mein persönliches Meisterwerk nun unter www.hoebrink.zeimke.com

Vielen dank nochmal, du hast mir sehr geholfen!

Verfasst: Di 7. Jun 2005, 23:50
von i-fekt
Immer wieder gerne. ;)

Verfasst: Mi 8. Jun 2005, 15:09
von Pillendreher
eine sache hätt ich da noch, hast du evtl eine gute CSS Referenz?!? Also SelfHTML hatte mir jetzt bei dem Problem mit CSS nciht so besonders geholfen?!?!

Verfasst: Mi 8. Jun 2005, 23:53
von andrej
@Pillendreher
Googeln hilft ;)

www.css4you.de <- das sollte eigentlich reichen

Barrierefrei Zentriert

Verfasst: Mo 8. Aug 2005, 20:41
von Aixtraweb
[error]

Barrierefrei Zentriert

Verfasst: Mo 8. Aug 2005, 20:43
von Aixtraweb
Hallo,

ich habe jetzt mal meine Seite mit diesem Thread versucht zu zentrieren, aber leider ohne Erfolg! Ziel: Der weisse Rand soll wie ein Passepartout um das Layout liegen. Bei einer Auflösung von 800x600 sollte das Layout formatfüllend sein und bei größeren Auflösungen z.B. bei 1024x768 sollte das Layout "browserfenstermittig" sein. Und beim scrollen sollte das Menue und der Butler eigentlich stehen bleiben und nicht mit nach oben wegscrollen.

Erstmal der Link: http://www.derreisebutler.de/cms/front_ ... hp?idcat=1

Hier der Code meiner CSS Datei:

Code: Alles auswählen

html,body {
	font-family: Verdana, Geneva, Arial, Helvetica, sans-serif;
	height: 100%;
	margin: 0px;
	overflow-y: hidden;
	padding-bottom: 0px;
	padding-left: 0px;
	padding-right: 0px;
	padding-top: 0px;
}

#butler {
	position:absolute; 
	width:250px; 
	height:451px;
	top:0px;
	left: 0px;
}

#menue {
	position:absolute; 
	width:175px; 
	height:324px; 
	left: 103px; 
	top: 11px; 
	bottom:0
}

#inhalt {
	position:absolute; 
	width:464px; 
	height:451px; 
	left: 294px; 
	top: 11px; 
	overflow: auto
	padding:5px;
}


#center {
	text-align: left;
	width: 780px;
	margin: 0px
	overflow: auto;
}

#main {
	height: 100%;
	overflow: auto;
	width: 100%;
}
Und nun noch die index.html bzw. meine Layout-Datei dazu:

Code: Alles auswählen

<html>

<head>
<title>Der Reisebutler</title>
<link rel="stylesheet" type="text/css" href="css/format.css">
</head>

<body>

<div id="main">
  <div id="center">
    <div id="butler">
      <img border="0" src="images/butler_menue.jpg" width="250" height="451"></div>
    <div id="menue">
      <table border="0" width="100%" height="100%">
        <tr>
          <td valign="bottom">CMS_CONTAINER[4]</td>
        </tr>
      </table>
    </div>
    <div id="inhalt">
      <table border="0" width="100%" cellspacing="0" cellpadding="5" height="100%">
        <tr>
          <td align="left" valign="top">
          <p style="margin-top: 0; margin-bottom: 2px" align="left">
          <span class="headline">CMS_CONTAINER[5]</span></p>
          <p style="margin-top: 0; margin-bottom: 2px" align="left">
          <span class="subheadline">CMS_CONTAINER[6]</span></p>
          <p style="margin-top: 0; margin-bottom: 2px" align="left">
          <span class="text">CMS_CONTAINER[7]</span></p>
          </td>
        </tr>
      </table>
    </div>
  </div>
</div>

</body>

</html>
Was mache ich denn falsch!?
Ich habe schon versucht DIV's hinzuzufügen oder wegzulassen und und und....

Wer kann mir denn helfen?