Pregunta

Tengo un 'main_menu' div que contiene una imagen de fondo que se repite en el eje y. Por encima de este div tengo otro div que se utiliza para una cabecera. El problema es que el div cabecera tiene una imagen que es de aproximadamente 75 píxeles de altura. Me gustaría empezar el texto en main_div aproximadamente 50 píxeles más alta desde donde realmente empieza la imagen de fondo de main_div.

Yo estaba pensando en algo como:

position:absolute; top:-50px;

Esto no funciona muy bien. La pregunta es ¿cómo puedo mover el texto hacia arriba, manteniendo la imagen de fondo en el lugar normal.

Gracias

{EDIT}

Aquí está la CSS

.menu_main
{
background-image:url('../menu_main.jpg');
background-repeat:repeat-y;
width:173px;
padding:5px;    

}
.menu_header
{
background-image:url('../menu_header.jpg');
text-align:center;
width:173px;
height:65px;
padding:5px;    
}

Este es el html

<div class="menu_header">Some Header</div>
<div class="menu_main">
    <ul>
        <li>Educational Objective</li>
        <li>Projects</li>
        <li>Class Preparation</li>
        <li>Testimonials</li>
    </ul>
</div>  

Así como se puede ver el encabezado es bastante alto. Así que me gustaría empezar el texto en el div menu_main sobre 50px más arriba

¿Fue útil?

Solución

Utilice un margen superior negativo.

.menu_main ul {margin-top: -50px;}

Otros consejos

Se podía moverlo como si estuviera haciendo con posicionamiento absoluto y mover hacia abajo el fondo de este modo:

background:url(someimage.png) repeat-y left 50px;

esto moverá la imagen bg por lo que comienza 50px hacia abajo.

Puede ser que sea capaz de ayudar más si se proporciona una captura de pantalla o más de código o un ejemplo vivo ...

Se puede estilo de su UL específicamente:

.nav
{
  position: relative;
  top: -50px;
}

y

<ul class="nav">
...

O tal vez poner la UL en otra clase DIV = "nav".

Pero se puede mover el fondo hacia abajo (por ejemplo, 5 píxeles):

background-position: top 5px;
Licenciado bajo: CC-BY-SA con atribución
No afiliado a StackOverflow
scroll top