DIV indipendente con distanza dal body fissa

Paperino78 · 2012-08-15T16:50:34+0200

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 · 2012-08-16T01:03:24+0200

Forse non ho capito la tua richiesta!
Ma come hai accennato tu con posizione fissa non gli dai le distanze che vuoi?

Paperino78 · 2012-08-16T12:38:44+0200

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 · 2012-08-16T17:23:27+0200

Dello schermo? Boh!

A me risulta che faccia riferimento all'angolo sinistro/alto della pagina (cioè al body) e non allo schermo

Paperino78 · 2012-08-16T17:39:09+0200

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 · 2012-08-16T18:12:06+0200

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 · 2012-08-16T23:56:05+0200

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 · 2012-08-18T16:33:10+0200

Sicuro che con margin-top e margin-left o margin-right non funzioni?

Cerca

Cerca

DIV indipendente con distanza dal body fissa

Paperino78

Utente Attivo

Max 1

Super Moderatore

Paperino78

Utente Attivo

Max 1

Super Moderatore

Paperino78

Utente Attivo

borgo italia

Super Moderatore

Paperino78

Utente Attivo

Malware

Utente Attivo

Discussioni simili