zurück zur Startseite
  


Zurück XHTMLforum > (X)HTML und CSS > CSS
Seite neu laden CSS: Boxen positionieren

Antwort
 
LinkBack Themen-Optionen Ansicht
  #1 (permalink)  
Alt 30.08.2005, 19:31
Neuer Benutzer
neuer user
Thread-Ersteller
 
Registriert seit: 08.06.2004
Beiträge: 27
sancho befindet sich auf einem aufstrebenden Ast
Standard CSS: Boxen positionieren

Moin zusammen,

okay, ich bin mit meinem Latein völlig am Ende!
Ich habe jetzt schon fast alle (fast, weil es sicherlich eine Möglichkeit gibt) Möglichkeiten probiert... hab mir float,position, etc. gearbeitet und nichts funktioniert RICHTIG! Entweder wird es ganz falsch dargestellt oder ganz anders als ich es will oder der IE 6 stellt es anders da als der FF.

Was ich will ist einfach nur die beiden Boxen "main" und "left" mittig unter dr "top" Box zu positionieren mit einem Abstand zwischen ihnen von 5px. Das ganze soll variabel sein (also % Angaben) damit man es auch auf 1024*768 anschauen kann!!

Bitte helft mir... ich packs einfach nicht!

Seite: http://sylt.ndi-networx.de

Gruß
sanhco
Mit Zitat antworten
Sponsored Links
  #2 (permalink)  
Alt 30.08.2005, 19:42
Benutzerbild von Boris
Tanzender Webentwickler
XHTMLforum-Kenner
 
Registriert seit: 29.07.2004
Ort: Kornwestheim / Stuttgart
Beiträge: 4.925
Boris ist ein sehr geschätzer MenschBoris ist ein sehr geschätzer MenschBoris ist ein sehr geschätzer Mensch
Standard

Ein Tip:

Code:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/1999/REC-html401-19991224/loose.dtd">
<html>
<head>
		<title>Tabletest</title>
		<meta http-equiv="content-type" content="text/html; iso-8859-1">
<style type="text/css" media="screen,projection">
*
{
	margin: 0;
	padding: 0;
}

#inhalt
{

}

#linkebox
{
	float: left;
	width: 30%;
	background-color: green;
}

#inhalt p
{
	margin-left: 32%;
	background-color: blue;
}

</style>
</head>
<body>

<div id="inhalt">
	<div id="linkebox">Links</div>
	

Hier steht der Inhalt</p>
</div>

</body>
</html>
Vergiss es allerdings, % mit px mischen zu wollen, das geht schief in diesem Fall.
__________________
My software never has bugs. It just develops random features ...

» DevShack - die Website des freien Webentwicklers Boris Bojic
Mit Zitat antworten
Sponsored Links
  #3 (permalink)  
Alt 30.08.2005, 22:39
Neuer Benutzer
neuer user
Thread-Ersteller
 
Registriert seit: 08.06.2004
Beiträge: 27
sancho befindet sich auf einem aufstrebenden Ast
Standard

So, ich habe es jetzt gelöst indem ich eine zusätzliche Box definiert habe und die beiden darein gepackt habe! Komischerweise habe ich das auch schon tausend Variante probiert und nie hat es geklappt! Egal... jetzt funktioniert es!

Jetzt muss ich nur noch dieses blöde Logo so hinbasteln, dass es die Boxen überlappt!

Btw. ist der Code soweit okay?

CSS:
Code:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
  "http://www.w3.org/TR/html4/loose.dtd">
<%@ language="vbscript"%>

<html>
	
	<head>
	  	
 		<link rel="stylesheet" type="text/css" href="css/home.css">
	</head>

	<body style="margin:0px">
  	<div id="top"><p align="center">top</p></div>
  	<div id="mainframe">
  		<div id="left">left</div>
  		<div id="main">main</div>
  	</div>	
	</body>
	
</html>
CSS:
Code:
#logo
     {
      float:left;
      margin-top:0px;
     }
#top{
     width:64%; 
     height:100px; 
     margin-top:0px;
     margin-left:auto;
     margin-right:auto;
     border:dashed 1px #000000;
    }
#mainframe{
           width:64%;
           height:680px;
           margin-top:5px;
           margin-left:auto;
           margin-right:auto;
           border:dashed 0px #000000;
          }             
#left{
			float:left;
			width:15%; 
      height:679.5px;
      border:dashed 1px #000000;
      }
#main{
		  float:right;
	    width:83.7%; 
      height:679.5px; 
      border:dashed 1px #000000;
      }

a:link 		{
		color:#000000; 
		text-decoration:none; 
		}
a:visited 	{color:#cccccc; 
		text-decoration:none;
		}
a:hover 	{
		color:#000000; 
		text-decoration:none;
		}
a:active 	{
		color:blue;
		}
p		{ 
    margin-top: 0
    }
Gruß
sancho
Mit Zitat antworten
  #4 (permalink)  
Alt 30.08.2005, 23:05
Benutzerbild von Boris
Tanzender Webentwickler
XHTMLforum-Kenner
 
Registriert seit: 29.07.2004
Ort: Kornwestheim / Stuttgart
Beiträge: 4.925
Boris ist ein sehr geschätzer MenschBoris ist ein sehr geschätzer MenschBoris ist ein sehr geschätzer Mensch
Standard

Was bezweckst du eigentlich mit so einem krummen Wert wie height:679.5px; ?

Und wenn der Inhalt länger wird, dann wird er nicht mehr dargestellt - das weisst du auch, oder?
__________________
My software never has bugs. It just develops random features ...

» DevShack - die Website des freien Webentwicklers Boris Bojic
Mit Zitat antworten
  #5 (permalink)  
Alt 30.08.2005, 23:43
Neuer Benutzer
neuer user
Thread-Ersteller
 
Registriert seit: 08.06.2004
Beiträge: 27
sancho befindet sich auf einem aufstrebenden Ast
Standard

Ajo... die krummen Werte kommen durch die Prozentangaben!!
Ich werd das ganze Ding nochmal überarbeiten und dann Bildschirmgrößenunabhängig machen.
Jetzt wo ich erstmal das Gerüst hab dürfte das ja kein Problem sein!

Gruß
sancho
Mit Zitat antworten
  #6 (permalink)  
Alt 31.08.2005, 00:34
Benutzerbild von E|H
E|H E|H ist offline
body:hover{display:none;}
XHTMLforum-Kenner
 
Registriert seit: 27.01.2005
Beiträge: 1.325
E|H befindet sich auf einem aufstrebenden Ast
Standard

Halbe Pixel lassen sich von Natur aus schwer darstellen...

Der Code ist eine ziemlich div-Suppe, obwohl fast noch nichts drinsteht.

Um einen Absatz braucht es keinen div (oder kommt da noch mehr rein?).
Laß mal solange divs weg, bis es wirklich nicht mehr geht.
Mit Zitat antworten
Antwort

Themen-Optionen
Ansicht

Forumregeln
Es ist Ihnen nicht erlaubt, neue Themen zu verfassen.
Es ist Ihnen nicht erlaubt, auf Beiträge zu antworten.
Es ist Ihnen nicht erlaubt, Anhänge hochzuladen.
Es ist Ihnen nicht erlaubt, Ihre Beiträge zu bearbeiten.

BB-Code ist an.
Smileys sind an.
[IMG] Code ist an.
HTML-Code ist aus.
Trackbacks are an
Pingbacks are an
Refbacks are aus


Ähnliche Themen
Thema Autor Forum Antworten Letzter Beitrag
Hitergrundbild(er) positionieren mit CSS seemawn CSS 2 17.07.2015 14:18
Bild mit CSS positionieren XER CSS 4 15.12.2011 14:47
CSS Boxen / Clear LARA1000 CSS 1 09.02.2009 08:01
CSS Tips & Tricks Webnauts Ressourcen 0 26.08.2006 00:04
3-spalten-layout --> boxen nebeneinander positionieren nevermind CSS 9 03.01.2006 13:08


Alle Zeitangaben in WEZ +2. Es ist jetzt 11:51 Uhr.