DIV indipendente con distanza dal body fissa

Paperino78

Utente Attivo
30 Giu 2012
409
0
16
Milano
Ragazzi, buon ferragosto a tutti, e visto che non so cosa fare mi chiedevo una cosa.
Ho la mia bella pagine web, tutta regolare, ma vorrei inserire un box, una colonna un riquadro, quello che sia a i bordi del contenitore in modo tale da poter inserire poi dei link tipo FB o Twitter o anche la login. So che mettendo il div con positin:fixed ed ipostando i valori top left etc, riesco a fissarlo e renderlo indipendente dal flusso della pagina web. Ma io avevo bisogno che avesse una distanza fissa dal contenitore e che restasse ovviamente fisso allo scorrere della pagina. Come posso fare? Lo devo inserire nel flusso oppure c'è un altro modo?

Grazie
 

Max 1

Super Moderatore
Membro dello Staff
SUPER MOD
MOD
29 Feb 2012
4.280
330
83
Forse non ho capito la tua richiesta!
Ma come hai accennato tu con posizione fissa non gli dai le distanze che vuoi?
 

Paperino78

Utente Attivo
30 Giu 2012
409
0
16
Milano
Le distanze le dai, certo, ma essendo indipendente dal sito e quindi dal body la distanze fanno riferimento al bordo dello schermo, quindi più grande è lo schermo più a destra o sinistra si troverà il box anche se inserisco delle distanze non sara mai "vicino" al contenitore.
 

Max 1

Super Moderatore
Membro dello Staff
SUPER MOD
MOD
29 Feb 2012
4.280
330
83
Dello schermo? Boh!:confused: A me risulta che faccia riferimento all'angolo sinistro/alto della pagina (cioè al body) e non allo schermo
 

Paperino78

Utente Attivo
30 Giu 2012
409
0
16
Milano
Ma guarda io ho messo un semplice div con larghezza e altezza base 100 x 100 fuori dal contenitore ma all'interno del body. Da questo mi trovo un box fuori dal sito, fisso cioè che rimane dove si trova allo scorrere della pagina ma la posizione gliela do riferendomi al body o comunque all'html che di per se è grande quanto lo schermo dove si viaualizza la pagina quindi se io riduco la pagina, non ottengo nessuna "riduzione" o zoom del sito visto che ha layout fisso (e quindi mi si incasina da matti) ma il box rimane alla stessa distanza dal bordo del browser. Io invece vorrei sapere come poterlo lasciare ad una distanza fissa dal contenitore.

Spero di essere stato chiaro. :byebye::book:
 

borgo italia

Super Moderatore
Membro dello Staff
SUPER MOD
MOD
4 Feb 2008
16.042
146
63
PR
www.borgo-italia.it
ciao
può darsi che sia una put....ta, ma prova
HTML:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<title>Documento senza titolo</title>
<style type="text/css">
#fisso{
position: fixed;
background-color:#990000;
width:300px;
height:215px;
top:5%;
margin-left:-150px;/*= metà della larghezza del fisso*/
left: 86%;/*da valutare con delle prove*/
}
#cont{/*contenitore centrato nel monitor*/
	width:600px;
	height:1500px;/*per avere lo scrol*/
	position: absolute;
	background-color: #c8c8c8;
	overflow: hidden;
	left: 50%;
	margin-left: -300px;/*= metà della larghezza del cont*/
	margin-top:5px;
}
</style>
</head>
<body>
<div id="cont">
<div id="fisso">
box fisso
</div>
contenitore
</div>
</body>
</html>
 

Paperino78

Utente Attivo
30 Giu 2012
409
0
16
Milano
Ciao, purtroppo non funziona. Ti allego il markup ed css.

Markup:
HTML:
</head>

<body>

<div id="contenitore">
<div id="box_ext_sx">Metti ciò che vuoi</div>
		<div style="height: 7px"></div>
        <div id="logo"><img src="images/logo nuovo biblio2.JPG" alt="" /></div>
        <div class="menu">
			<ul class="primo">
			   <li class="active "><a href="Master.php"><span>Home</span></a>
			<ul>
         <li><a href="Dove Siamo.php"><span>Dove Siamo</span></a></li>
         <li><a href="Chi Siamo.php"><span>Chi Siamo</span></a></li>
HTML:
#box_ext_sx {	position:fixed;
			left:10px;
			top:10px;
			width:150px;
			height:150px;
/*			margin: 100px 0 0 15px;*/
			background-color:#CCCCCC;
			-moz-border-radius: 10px 10px 10px 10px;
			-webkit-border-radius: 10px 10px 10px 10px;
			border-radius: 10px 10px 10px 10px;

#contenitore {	min-height: 100%;
				width: 100%;
				height: 1%;
				max-width: 980px;
				background-color:transparent;
				border: 5px;
				height: 100%;
				height: auto !important; 
				margin: 0 auto -65px; /* Stessa altezza del footer*/
				-moz-border-radius: 10px 10px 10px 10px;
				-webkit-border-radius: 10px 10px 10px 10px;
				border-radius: 10px 10px 10px 10px;
come si vede ho provato ad inserirlo dentro il contenitore ma mi ha scompaginato tutto! :dipser: quindi nulla. Per rendere le cose più chiare vi dico che nella home page di questo sito, non del forum ma del sito c'è un box a lato con le voci fb twitter google+ che rimane alla stessa distanza dal contenitore principale, questo sia che rimpicciolisca la pagina sia che la ampli. Naturalmente il contenitore rimane della stessa larghezza centrato e gli spazi vengono coperti con il bianco.

Che ne dite come si fa?
 

Malware

Utente Attivo
19 Lug 2012
112
0
0
Sicuro che con margin-top e margin-left o margin-right non funzioni?