Centrar capa y sumarle pixeles hacia un lado

[chichote]

Hola amigos, espero esten todos bien, aver si me hechan una manito.

Lo que quiero hacer y no consigo es posicionar un div en un sector de la pagina, y mi idea es posicionar hacia el centro con

Código HTML:

margin:0 auto;

pero luego quiero correrlo 200px hacia la derecha, es decir que quede hacia la derecha, y no quiero que quede totalmente hacia la derecha, sino lo haria con right:0. Ademas tengo en cuanta que debe funcionar tanto para 1024, 1280, etc.


Espero me puedan ayudar,.


Saludos

[tempto]

con margin:auto ya te lo centra, y si quieres desplazarlo a un lado puedes usar padding-left/padding-right o margin-left/margin-right y le das la cantidad en píxeles o porcentaje

la diferencia entre padding y margin es que padding te desplaza el contenido dentro de la capa, y margin te desplaza la capa

[chichote]

Gracias tempto, jejejeje, era algo un poco obvio, pero aun asi me enrede entero con esto jajajajaja.

Gracias un abrazo.

[chichote]

mmmm, no era tan obvio jajaa, no me funciono.

mira, explico mejor lo que quiero hacer y entrego el codigo para ver si me dan una mano.

Quiero lograr una barra similar a la de facebook, esa que siempre esta visible, bueno que antiguamente tenia facebook, porq ahora la ha cambiado, para eso posiciono la capa con el siguiente codigo

Código HTML:

#barra
		{
		background: url(../img/bg-barra.jpg) repeat-x;
		width:300px;
		color: #999999;
		height:21px;
		text-align:center;
		position:fixed;
		top:0;
		padding-bottom:2px;
		z-index:999;
		}

la diferencia de mi codigo es q posiciona la barra en la parte superior con top:0, pero queria remplazar el top:0; por margin:0 auto; para que se centre, pero me la deja a la izquierda y se baja, no se como se hara, y el position:fixed es porque tengo otra capa contenedora que tiene todo el sitio y quiero que esta barra aparezca arriba de esta sin que la contenedora subra cambios en la posicion.

Alguna idea?

Saludos

[Impostor]

Buenas, aver si esto te funciona

1. Con margin: 0 auto; centras el div.
2. Le añades position: relative; left: 200px; Con esto lo desplazas 200px hacia la derecha.

Saludos¡¡

[chichote]

Gracias Impostor, pero no me funciono asi, porque la capa contenedora que la tengo asi

Código HTML:

overflow: hidden;
	width:960px;
	margin:0 auto;
	text-align:left;
	/*border:1px solid #00FF00;*/
	margin-top:15px;

algo hace que me tira la barra hacia la izquierda :(

gracias

[chichote]

Listo muchachos, lo he logrado jejeje, lo posteo aca para quien le sirva

Codigo CSS

Código HTML:

#barra_sup
		{
		width:100%;
		color: #999999;
		height:21px;
		position:fixed;
		top:0;
		padding-bottom:2px;
		z-index:999;
		}
#barra_sup #sup_izq
		{
		background: #EEEEEE;
		width:290px;
		padding-left:5px;
		padding-right:5px;
		height:20px;
		margin:0 auto;
		position:relative;
		left:200px;
		}

Codigo HTML

Código HTML:

<div id="barra_sup">
        <div id="sup_izq">
        	Bienvenid@: Juan Rivera
        </div>
</div> 

lo hice con dos capas, gracias por el consejo Impostor, me sirvio

Saludos.