Problem med css och position

4 svar · 1 191 visningar · startad av saw 17 mars 2011

sawMedlem sedan mars 20011 880 inlägg

Frågan17 mars 2011 14:54#1

Jag har problem med att få till det på en webbplats. Jag har ett antal divar som ligger definierade i css, men jag får inte till det och tänker börja om ifrån noll.
Bifogad bild visar hur jag har tänkt, det är asp.net och med en masterpage.
Mitt problem är

Hur jag än gör så kan jag inte få till det så att det är lika mycket luft på vänster som höger-sida.
Om man drar i bläddraren t ex Explorer, så följer de olika divarna med på olika sätt. Jag skulle vilja ha det dynamiskt, så ändrar man storleken, så skall divarna följa med i rätt propition.

Jag vore väldigt tacksam om jag kunde få lite hgjälp med det här. :stud

rhdfMedlem sedan okt. 2007446 inlägg

17 mars 2011 15:08#2

gissningsvis vill du ha allt centrerat. Enklast är ju då att stoppa in allt i en omgivande wrapper-div, som du sedan centrerar.

så enkelt sagt borde något i den här stilen funka


<div id="wrapper">
   <div id="header">
   logga
       <div id="loginform">
         login-form
       </div>
   </div>
   <div id="sidebar"></div>
   <div id="content"></div>
   <div id="footer"></div>
</div>

med Css

#wrapper{margin:auto;}
#header{height:90px;}
#sidebar{width:100px;float:left;}
#content{margin-left:100px;}
#footer{clear:both;height:90px}

#loginform{float:right;}

sawMedlem sedan mars 20011 880 inlägg

17 mars 2011 16:01#3

Tack det ser ju kanonbra ut, men var menar du att <asp:ContentPlaceHolder id="ContentPlaceHolder1" runat="server"> skall ligga?
Det finns ju en placerad i headen och en i body.

voigtann1Medlem sedan juni 20019 519 inlägg

17 mars 2011 16:04#4

Vad innehåller innehåller den? lägg bara in den i #header div:en

sawMedlem sedan mars 20011 880 inlägg

17 mars 2011 17:15#5

voigtann1: ingenting

Jag tror nog att det är bäst att jag visar min css nu. Givetvis är det jag som gör galet men den uppför sig på samma sätt igen, dvs visa saker följer med när man drar i kanten på webbläsaren, andra inte så mycket.
Jag har försökt att trixa med min-width osv men inget bra resultat.

body 
{
	font:10px/1.4em Comic Sans MS,Verdana, Geneva, Arial, Helvetica, sans-serif;
	color:Black;
}
#wrapper{margin:auto;}
#header
{
	position:absolute;
	top: 15px;
	margin-left:10%;
	margin-right:10%;
	height:90px;
	width:80%;
	background-image:url('../Bild/Logga_Bakgrund.png');
	background-repeat:no-repeat;
	font-weight:bold;
	font-size:14px;
 }
#sidebar
{
	position:absolute;
	left:10.5%;
	width:150px;
	top:103px;
	height:100%;
	background-color:#9dbad7;
	float:left;
	}
#content
{
	
	padding: 15px 15px 15px 15px;
	color:Black;
	position:absolute;
	left:22%;
	top:110px; 
	width:62%;
	max-width:780px;
	height:72%;
	background-color: White;
	border-left:3px solid #d4d2d3;
	border-top:3px solid #d4d2d3;
	border-right:3px solid #716f6f;
	border-bottom:3px solid #716f6f;
}
#footer
{
	clear:both;
	position:absolute;
	bottom:0px;
	margin-left:10%;
	margin-right:10%;
	height:50px;
	width:73%;
	background-image:url('../Bild/Footer.png');
	
}
#footer a
{
	font-family:verdana;
	font-weight:bold;
	text-decoration:none;
	padding:1px 1px;
	margin:0px;
	color:White;	
	filter:Shadow(Color="#1f1c89", direction=145);
	-ms-filter:Shadow(Color="#1f1c89", direction=145);
}
#footer  a:hover
{
	text-decoration:underline overline;
    font-weight:bold;
    color:blue;
}

#loginform
{
	float:right;
	position:absolute;
	left:76%;
}

Är jag helt galet ute?