float

dr-stein

Mitglied
Liebe Tutorials-Gemeinde,

bisher hatte ich immer gedacht, ich würde CSS relativ gut beherrschen, und muss nun zugeben, dass ich überfragt bin. Also folgendes Probelem:

Ich hab ne Homepage, bei der auf der LINKEN Seite eine Navigation ist:

Code:
#navi { 
	width: 230px; 
	float: left; 
	height: 80%; 
  margin-left: 10px;
	margin-right: 10px;
	margin-bottom: 30px;
  position: fixed;
}

Nun... das klappt auch alles auch im Headbereich klappt alles. Nun soll auf der rechten seite ebenfalls ne Box sein:

Code:
#content_right{
border-left: 1px dashed;
float:right;
}

Nun klappt das aber nicht. Hier einmal der ganze CSS Teil der für die HP wichtig ist:
(nicht wundern, ist nicht viel)

Code:
#header{
height: 130px;
width: 850px;
background-repeat:no-repeat;
margin: auto;
}


#content{
border: 0px solid #000000;
margin-left: 240px;
margin-right: 50px;
margin-bottom: 20px;
margin-top: 0px;
padding: 5px;
}

#navi { 
width: 230px; 
float: left; 
height: 80%; 
margin-left: 10px;
margin-right: 10px;
margin-bottom: 30px;
position: fixed;
}

Bitte um antworten.
 
Zuletzt bearbeitet:
Hi,

und wie lautet dein dazugehöriger HTML-Code?

Bei mir funktioniert es nämlich soweit einwandfrei.

mfg Maik
 
Kann ich dir anhand dieses Codeschnipsels nicht sagen, denn bei mir wird er weiterhin rechts ausgerichtet.

Es wäre weitaus interessanter und hilfreicher, wenn du den vollständigen HTML-Code zeigen würdest, um hier einen sachdienlichen Hinweis geben zu können.

Ein Link zur Problemseite ist auch genehm :-)

mfg Maik
 
Es wäre weitaus interessanter und hilfreicher, wenn du den vollständigen HTML-Code zeigen würdest, um hier einen sachdienlichen Hinweis geben zu können.

Kein Problem:

HTML:
<!-- Start Variablen -->
<?php include("include/variablen.php"); ?>
<!-- Ende Variablen -->





<link rel="SHORTCUT ICON" href="<?php echo "$url"; ?>/images/favicon.ico">
<link rel="STYLESHEET" type="text/css" href="<?php echo "$url"; ?>/css/default.css">
<title><?php echo "$startseite"; ?></title>
<!-- Bis hier bitte nichts entfernen -->





<!-- Start
POPUP -->
<?php include("include/herzlich_willkommen.html"); ?>
<!-- Ende
POPUP -->





<!-- Start
Fotobox -->
<script type="text/javascript">
    var GB_ROOT_DIR = "<?php echo "$url"; ?>/js/box/";
</script>
<script type="text/javascript" src="<?php echo "$url"; ?>/js/box/AJS.js"></script>
<script type="text/javascript" src="<?php echo "$url"; ?>/js/box/AJS_fx.js"></script>
<script type="text/javascript" src="<?php echo "$url"; ?>/js/box/gb_scripts.js"></script>
<link href="<?php echo "$url"; ?>/js/box/gb_styles.css" rel="stylesheet" type="text/css" />
<!-- End
Fotobox -->





<!-- Start
Videobox -->
<script type="text/javascript" src="<?php echo "$url"; ?>/js/video/mootools.js"></script>
<script type="text/javascript" src="js/video/swfobject.js"></script>
<script type="text/javascript" src="js/video/videobox.js"></script>
<link rel="stylesheet" href="<?php echo "$url"; ?>/js/video/videobox.css" type="text/css" media="screen" />
<!-- End
Videobox -->





<!-- Start
Header -->
<div id="header"></div>
<!-- End
Header -->





<!-- Start
Navigation -->
<div id="navi"> 
<br><br>       
<?php include("include/navigation.html"); ?>
</div>
<!-- Ende
Navigation -->





<!-- Start
Randbox -->
<div id="content_right"> 
Test
</div>
<!-- Ende
Randbox -->





<!--Start 
Content -->        
<div id="content"><center><h1>Herzlich Willkommen</h1><br /><br /><br />
auf der Internetseite der Familie Schl&uuml;ter aus Bremen. Hier k&ouml;nnen sie Interessantes erfahren und sich nat&uuml;rlich auch im Portal registrieren. <br /><br />Klicken Sie durch und erfahren sie mehr &uuml;ber: <br /><br /> <big><big> Sabine, J&ouml;rn, Eike und Olof Schl&uuml;ter.</big></big> <br /><br />Wir freuen uns, dass Sie uns besuchen.<br /><br /><br /></div>
</center></div>

Das ist die komplette Internetseite. Hier auch einmal der Link: http://www.schlueter.ws/index_2.php

Achso... bevor ich es vergesse, hier auch einmal der CSS-Code:

Code:
/*
Eike Kilian Schlüter
www.schlueter.ws
webmaster@schlueter.ws
*/

body {
background-image:url(http://schlueter.ws/images/background.jpg);
background-attachment: fixed;
margin: 10px 0px 0px 0px; 
text-decoration: none; 
font-family: Tahoma, Times New Roman, Veranda sans-serif; 
font-size: 13px; 
color: #CD3333; 
border: 0px;
}

#rechts { 
	width: 100px; 
	float:right; 
	height: 80%; 
  margin-left: 85%;
	margin-right: 10px;
	margin-bottom: 30px;
        position: fixed;

} 

#content{
border: 0px solid #000000;
margin-left: 240px;
margin-right: 50px;
margin-bottom: 20px;
margin-top: 0px;
padding: 5px;
}

#content_right{
border-left: 1px dashed;
float:right;
}

#mail_content{
border: 0px solid #000000;
background-color: #FFFFFF;
margin-left: 50px;
margin-right: 50px;
margin-bottom: 20px;
margin-top: 0px;
padding: 5px;
}

#header{
height: 130px;
width: 850px;
background-repeat:no-repeat;
margin: auto;
}

#mail_header{
height: 20px;
width: 850px;
background-repeat:no-repeat;
margin: auto;
}


textarea {
	font-family: Arial;
	font-size: 13px;
	background-color: #ECECEC;
	border: 1px solid #A9B8C2;
}


input {
	background-color: #ECECEC;
	border: 1px solid #A9B8C2;
}

input:focus {
	background-color: #F8F8F8;
}


.input_right {
	text-align: right;
	padding: 0px 2px;
}


select {
	background-color: #ECECEC;
	border: 1px solid #A9B8C2;
}


#navi { 
	width: 230px; 
	float: left; 
	height: 80%; 
  margin-left: 10px;
	margin-right: 10px;
	margin-bottom: 30px;
  position: fixed;
}
 
Entgegen deinem hier gezeigten Code steht in der Online-Version dieses hier:
Code:
<div id="content_left"> Test </div>


mfg Maik
 
Zurück