zurück zur Startseite
  


Zurück XHTMLforum > (X)HTML und CSS > CSS
Seite neu laden Mal wieder ein doofes float Problem

Antwort
 
LinkBack Themen-Optionen Ansicht
  #1 (permalink)  
Alt 11.05.2005, 19:29
Benutzer
neuer user
Thread-Ersteller
 
Registriert seit: 03.06.2004
Beiträge: 40
Heavenfighter befindet sich auf einem aufstrebenden Ast
Standard Mal wieder ein doofes float Problem

Hallo,


ich mal wieder Probleme beim floaten*g.
Ich möchte gerne wir divs auf eienr Seite so anordnen wie hier dargestellt:



Aber ich bekomme den Content Bereich einfach nicht dazu, rechts neben dem menu berich zu sein. Was mache ich denn falsch?

Dabei sollte wenn es geht, der content Bereich auch komplett bis zum rechten Browserrand hinnüberreichen.

Code:
<style type="text/css">
<!--

	div#face
	{
		border-style:solid; 
		border-width:0; 
		margin-left: 10px; 
		margin-right:auto;
		margin-top: 10px; 
		margin-bottom: auto;  
		float: left; 
		padding:0px; 
	}
	
	div#top
	{
		margin-left: 180px; 
		margin-right:auto;
		margin-top: 10px; 
		margin-bottom: auto; 
		padding:0px; 
	}
	
	div#menu
	{
		border-left:solid 2px; 
		border-right:solid 2px; 
		border-bottom:solid 2px; 
		padding-top:0px; 
		padding-bottom:25px; 
		border-color: #816344; 
		margin-left: 20px; 
		width:200px; 
		clear:left;
	}
	
	div#content
	{
		margin-left:20px; 
		margin-right: 0px;
	}
-->
</style>

<body>
	<div id="face">
		[img]images/face.gif[/img]
	</div>
	
	<div id="top">
		<table border="0" cellspacing="0" cellpadding="0">
		<tr>
			<td>
				[img]images/titel.png[/img]
			</td>
			
			<td class="topright">
				<table border="0" width="100%" height="100%" cellspacing="0" cellpadding="0">
				<tr>
					<td class="counter">
						32
					</td>
				</tr>
				<tr>
					<td class="subcounter">
						0
					</td>
				</tr>
				</table>
			</td>
		</tr>
		</table>
	</div>
	
	<div id="menu" align="center">
		
			{(homelink)}
			
			{(levelonestart)}
			
			<li class="list1">{(mainname)}{(leveloneliend)}
			{(leveltwostart)}
			
				<li class="list2" >{(leveltwoname)}
			
			{(leveltwoend)}
			
			{(leveloneend)}
		
	</div>
	
	<div id="content">
		
				
				
					&raquo;{(linkname)}
				
				
	</div>

</body>
Mit Zitat antworten
Sponsored Links
  #2 (permalink)  
Alt 12.05.2005, 10:07
{ display: random;}
XHTMLforum-Kenner
 
Registriert seit: 08.09.2004
Ort: Stuttgart
Beiträge: 5.034
andir ist ein wunderbarer Anblickandir ist ein wunderbarer Anblickandir ist ein wunderbarer Anblickandir ist ein wunderbarer Anblickandir ist ein wunderbarer Anblickandir ist ein wunderbarer Anblick
Standard

Da deine Container unterschiedliche Höhen haben, wird das mit deinem bisherigen System etwas schwierig.

Pack mal #face und #menu in einen eigenen umgebenden Container und lasse nur den floaten. Das gleiche mit top und content.
Für den linken container kannst Du feste oder relative Breitenangaben verwenden, für den rechten einfach :auto .

Das sollte funktionieren.,

grüsse andir
__________________
Grüsse Andreas- auch mal wieder da...

Design isn't about the tools, it's about creating the best experience for the user. A design should be based on usability, accesibility, aesthetics, but never on floats, lists or background images. ( by Cameron Adams)
Wiedergelesen: > hier und hier

[Foren-Links] Dein Post? Klar, DAS vorher gelesen? Hilft. ## User-Landkarte
Mit Zitat antworten
Sponsored Links
  #3 (permalink)  
Alt 13.05.2005, 21:09
Benutzer
neuer user
Thread-Ersteller
 
Registriert seit: 03.06.2004
Beiträge: 40
Heavenfighter befindet sich auf einem aufstrebenden Ast
Standard

Hey,

ok mit deiner Lösung klappt es.
Sowas hatte ich mir auch schon gedacht, nur wollte ich zusätzliche div's vermeiden.

Aber egal. Klappt prima
Mit Zitat antworten
  #4 (permalink)  
Alt 13.05.2005, 21:14
Benutzer
neuer user
Thread-Ersteller
 
Registriert seit: 03.06.2004
Beiträge: 40
Heavenfighter befindet sich auf einem aufstrebenden Ast
Standard

Ach so,


ein kleines Problem hab ich noch.
Ich habe nun für den Inhalt ein ganz normales div, mit padding: 0px;
Jetzt möchte ich darin eine Tabelle welche nur aus einer Zeile besteht einfügen, aber im IE ist zwischen dem linken Rand vom div und der Tabelle immer ca. 2px Abstand, den ich nicht weg bekomme.
Im Firefox ist dieser Abstand nicht zu sehen.

Code:
<div id="test">
<table id="nodes" border="1" cellspacing="0" cellpadding="0">
<tr>
<td>[img]images/node_left.gif[/img]</td>
<td>[img]images/bar.gif[/img]</td>
<td>[img]images/node_right.gif[/img]</td>
</tr>
</table>
</div>


Das rote ist das div.

Ok, habs schon gefunden, das ist wohl der sogenannte 3px Bug beim IE.
Gelöst habe ich es so, wie hier beschrieben:
http://www.perun.net/2004/07/09/3-pixel-abstand/
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
Problem mit float und margin raz CSS 4 11.12.2008 15:58
Problem mit float und position:absolute infernalshade CSS 4 12.11.2008 10:52
Problem im IE7: div hinter input platzieren per float Heavenfighter CSS 2 19.06.2007 16:50
Problem mit Layout .. vermute: float Küspert CSS 3 09.12.2006 18:09
Float Problem, 4 Inhalts Elemente nebeneinander denny CSS 0 23.08.2004 15:59


Alle Zeitangaben in WEZ +2. Es ist jetzt 14:33 Uhr.