Just nu i M3-nätverket
Gå till innehåll
Eforum är stängt för nya inlägg och svar sedan 20 juni 2022. Klicka för att läsa vad som hände och om alternativ.

Justera div i annan div

fickler

Startad av fickler,
i Webbutveckling

Rekommendera Poster

fickler

fickler

Postad
Postad

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

Länk till kommentar
Dela på andra webbplatser
ChromaWoods

ChromaWoods

Postad
Postad

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:right på div.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?

Länk till kommentar
Dela på andra webbplatser

Arkiverat

Det här ämnet är nu arkiverat och är stängt för ytterligare svar.

Gå till ämneslista


×
×
  • Skapa nytt...