Just nu i M3-nätverket
Gå till innehåll
fickler

Justera div i annan div

Rekommendera Poster

Hej,

 

ledsen för min kassa titel, försöker förklara här istället.. Har en sida med en meny som ligger fixe uppe i högra hörnet. Eftersom det ska se bra ut på olika upplösta skärmar är tanken att ha en class som heter width_fix som säger hur många pixlar brett det ska vara (har en bakgrundsbild som måste hamna rätt) och sedan justera menyn till högerkanten på denna.

Men trots en massa försök så lägger sig diven längst ut till höger ändå. Och menyn måste vara fixed för det är en scroll-sida där menyn ska ligga kvar hela tiden. Hoppas nu förstår!

 

Bifogar lite kod:

 

CSS

body {
	background: #555555 url(images/bg.jpg) no-repeat scroll center top;
	font-family: Georgia, "Times New Roman", Times, serif;
}
.width_fix {
	width: 1340px;
	margin: 0 auto;
	position: relative;
	overflow-x: hidden;
}div.menu {
	float: right;
	right: 0px;
	height: 300px;
	top: 0px;
	position: fixed;
	z-index: 1000;
}
div#social {
	width: 508px;
	position: relative;
	z-index: 1000;
	float: right;
}
div#slide_center {
	width: 100%;
	margin: 0px auto;
}/* Navigation */
ul#nav {
	height: 100px;
	width: 720px;
	padding: 0px;
	list-style: none;
	background: url(images/nav.png) left 0;
	float: right;
}
* html ul#nav {
	top: 15px;
	position: absolute;
}
ul#nav li {
	float: left;
}
ul#nav li a {
	height: 40px;
	float: left;
	margin: 30px 0px 30px;
	text-decoration: none;
	text-indent: -100000px;
	border: none;
	overflow: hidden;
}

HTML

<body class="loading">
<div class="width_fix"> <a class="loc" name="home"></a>
<div class="menu">
<div id="slide_center">
<div id="social">
<ul id="nav">
<li><a href="#tavling" id="tavling">Tävlingen</a></li>
<li><a href="#program" id="program">Program</a></li>
<li><a href="#biljetter" id="biljetter">Biljetter</a></li>
<li><a href="#jobbare" id="jobbare">Jobbare</a></li>
<li><a href="#lag" id="lag">Lag</a></li>
<li><a href="#home" id="home">Upp</a></li>
</ul>
</div>
</div>
<!-- slide_center --> 
</div>
<!-- slider -->
<div id="container"> 
<!-- Container Open (left) -->
<div id="one">
......

Tack på förhand!

 

//fickler

Dela detta inlägg


Länk till inlägg
Dela på andra webbplatser

Nej, fattar faktiskt inte riktigt. :) Försöker slänga in din kod i en JS-bin men kan inte riktigt se allt.. du har inget live-exempel på problemet?

 

Tips 1: Det finns ingen anledning att speca HTML-element om du använder ID i CSS:en, alltså typ ul#nav, eftersom ID måste vara unikt i vilket fall. Du gör bara selektorn långsammare om du prefixar ett element. Personligen använder jag aldrig ID för att styla, bara classer, det är oändligt mer återanvändbart.

 

Tips 2: position:fixed är... fixerad position, obviously. Sätter du fixed och top:0 samt right:0 så kommer elementet vara längst upp till höger på din skärm, oavsett allt. Att du har satt float:rightdiv.menu har med andra ord nada effekt.

 

Nyfiken: * html ul#nav är en helt galen selektor som dessutom är super-ineffektiv. Varför behöver du den?

Redigerad av chromawoods

Dela detta inlägg


Länk till inlägg
Dela på andra webbplatser

Skapa ett konto eller logga in för att kommentera

Du måste vara medlem för att kunna kommentera

Skapa ett konto

Skapa ett nytt konto på vårt forum. Det är lätt!

Registrera ett nytt konto

Logga in

Redan medlem? Logga in här.

Logga in nu



×
×
  • Skapa nytt...