Hello -

I'm trying to display graphical headers above each section of my page. These headers are basically just a rectangular graphic with a space for text in them. As of now I'm using a graphic editing program to overlay a textbox with the relevant heading title and then saving the new graphic as a gif.

I would really like to make one graphic with a blank spot for the title and then fill in the title within my page with a database query. Is there any kind of support for this in HTML or JavaScript for that matter.

Thanks,
Mike

You can use layers;
define <style> - definition

<style>
.overall {
    position : relative;
    left : 0;
    top : 0;
}
.overlay {
    position : absolute;
    // define position of text
    left : 3;
    top : 4;
}
</style>

<div class="overall">
    <img src="yourimage goes here">
    <div class="overlay">Your text</div>
</div>

Works in both IE and NS

GreetZ,

Bosboom

I tried using that code but the text ends up showing up next to the image, not on top of it. I've tried changing the absolute and relative values in each class but all that does is change the text from being to right of the image to being below it.

Have you ever seen this behavior?

Mike

You probably did copy the code with the comment

// define position of text

DELETE THIS LINE!!!

Then it works fine...

That was it. I'm so used to C and Java code that I didn't even think about the different comment syntax.

Thanks a million.

-Mike