moving text while keeping background-image in CSS

background-image, css, html, positioning

Solution

Use a negative top margin.

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

Problem

I have a 'main_menu' div which contains a background-image that is repeating on the y-axis. Above this div I have another div which is used for a header. The problem is that the header div has an image which is about 75px in height. I would like to start the text in main_div about 50 px higher from where main_div's background-image actually starts. I was thinking of something like: ``` position:absolute; top:-50px; ``` This doesn't really work. The question is how do I move the text up, while keeping the background-image at the normal spot. Thanks {EDIT} Here's the 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; } ``` This is the 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> ``` So as you can see the header is pretty tall. So I'd like to start the text in the menu_main div about 50px higher up

Original source