zurück zur Startseite
  


Zurück XHTMLforum > (X)HTML und CSS > CSS
Seite neu laden Positionierungsproblem

Antwort
 
LinkBack Themen-Optionen Ansicht
  #1 (permalink)  
Alt 06.06.2005, 13:18
Benutzerbild von i-fekt
Erfahrener Benutzer
XHTMLforum-Mitglied
Thread-Ersteller
 
Registriert seit: 01.06.2005
Beiträge: 422
i-fekt befindet sich auf einem aufstrebenden Ast
Standard Positionierungsproblem

Hi,

mit den position Attributen arbeite ich normal nie und habe entsprechend Probleme. Habe nun einen Versuch gestartet an dem ich im Netscape bisher kläglich scheitere.
Ein Header hat links ein Logo, rechts oben eine Navi und rechts unten weitere Links.

Im Netscape wandern die weiteren Links immer in die rechte untere Ecke des Browsers.

Code:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
 "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1"/>
<meta http-equiv="Content-Language" content="de"/>
<title>~</title>
<link rel="stylesheet" type="text/css" href="screen.css" media="screen" />
<style type="text/css">
<!--
html, body {
	padding: 0;
	margin: 0;
	font-family: Arial, Verdana, Helvetica, sans-serif;
	font-size: 100%;
	color: #000;
}

img {
	border: none;
}

.clear {
	clear: both;
}

div#header {
	width: 800px;
	border-left: 1px solid white;
	border-right: 1px solid white;
	background-color: #3c79b5;
	font-size: 75%;
}

div#header div.left {
	width: 400px;
	float: left;
}

div#header div.left img {
	display: block;
}

div#header div.right {
	width: 350px;
	height: 70px;
	float: left;
	background-color: blue;
	position: relative;
}

div#header div.right div {
	color: red;
}

div#header div.right div.oben {
	float: right;
	height: 35px;
	padding: 2px 10px;
	border-left: 1px solid white;
	position: absolute;
	top: 0px;
	right: 0px;
}

div#header div.right div.unten {
	position: absolute;
	bottom: 0px;
	right: 0px;
}
//-->
</style>
</head>

<body>
<div id="header">
 <div class="left">[img]y.gif[/img]</div>
 <div class="right">
  <div class="oben">AAA</div>
  <div class="unten">BBB</div>
 </div>
 <br class="clear"/>
</div>

</body>
</html>
Was muss ich anders machen, wieso geht das so nicht?

(Ich habe den Quelltext mal abgespeckt, bei "AAA" kommt eine UL und bei "BBB" normale Links, aber gefloatet um ihnen ein Padding verpassen zu können. Klappte eigentlich überall prima bis auf Netscape halt.)
Mit Zitat antworten
Sponsored Links
  #2 (permalink)  
Alt 06.06.2005, 14:43
Erfahrener Benutzer
XHTMLforum-Mitglied
 
Registriert seit: 26.06.2004
Beiträge: 172
beeviz befindet sich auf einem aufstrebenden Ast
Standard Re: Positionierungsproblem

Zitat:
Zitat von i-fekt
Hi,

mit den position Attributen arbeite ich normal nie und habe entsprechend Probleme. Habe nun einen Versuch gestartet an dem ich im Netscape bisher kläglich scheitere.
Ein Header hat links ein Logo, rechts oben eine Navi und rechts unten weitere Links.

Im Netscape wandern die weiteren Links immer in die rechte untere Ecke des Browsers.

hm, und wo is nun dein problem?


wenn du die links innerhalb des headers rechts unten haben möchtest, musst du dem header n position: relative; geben. dann werden objekte innerhalb des headers am header ausgerichtet.
Mit Zitat antworten
Sponsored Links
  #3 (permalink)  
Alt 06.06.2005, 14:53
Benutzerbild von i-fekt
Erfahrener Benutzer
XHTMLforum-Mitglied
Thread-Ersteller
 
Registriert seit: 01.06.2005
Beiträge: 422
i-fekt befindet sich auf einem aufstrebenden Ast
Standard

Das dachte ich ja auch und so sieht mein HTML und CSS ja auch aus, aber wenn du das mal in Netscape anschaust dann stimmt das nicht mehr. Die "weiteren Links" wandern immer in die rechte untere Ecke des Browsers, nicht in die rechte untere Ecke des DIVs.
Mit Zitat antworten
  #4 (permalink)  
Alt 06.06.2005, 15:06
Erfahrener Benutzer
XHTMLforum-Kenner
 
Registriert seit: 28.01.2005
Beiträge: 11.775
fricca kann auf vieles stolz seinfricca kann auf vieles stolz seinfricca kann auf vieles stolz seinfricca kann auf vieles stolz seinfricca kann auf vieles stolz seinfricca kann auf vieles stolz seinfricca kann auf vieles stolz seinfricca kann auf vieles stolz sein
Standard

Sieht nach einem Bug bei Verbindung von float und position:relative aus.
Sobald du die float-Eigenschaft rausnimmst, nimmt auch der NN die richtige Box als Referenz.

Ich hab' mal in das div .right noch ein div reingelegt und diesem dann position:relative gegeben. Dann machts auch der NN.

Grüße
fricca
Mit Zitat antworten
  #5 (permalink)  
Alt 06.06.2005, 15:10
Benutzerbild von i-fekt
Erfahrener Benutzer
XHTMLforum-Mitglied
Thread-Ersteller
 
Registriert seit: 01.06.2005
Beiträge: 422
i-fekt befindet sich auf einem aufstrebenden Ast
Standard

Ich war wohl etwas zu doof, hab es nun hinbekommen. Einfach einen Container darunter das relative gesetzt, nun funzt es.
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
Positionierungsproblem im IE flol CSS 4 28.09.2008 13:48
Positionierungsproblem meiner Boxen onkel-tom CSS 7 24.05.2008 16:14
Positionierungsproblem earzone CSS 5 13.05.2008 21:36
Positionierungsproblem Geronimo CSS 14 26.09.2007 14:51
Positionierungsproblem fürs Menü brina CSS 8 25.08.2004 00:12


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