Placing text over a jpeg of my own creation in the header or div

Yes, I’m sort of new to this, but here’s my issue: I create my own images. I’m not looking to insert an image that’s got a url at present. I simply want to use my own image created in photoshop into the header and/or the main content area and be able to enter text over the top of it.

I’ve been to dozens of pages, but they all assume that you want to use an image that you get off of the internet. No. I place the image by simply using

<div id="header">
<h1 style="margin: 0;"><img src="klikitathead.jpg;" style="width:100%;" style="height:auto;" alt="klikitat art"/></h1>
</div><!-- End header -->

The image is there. How do I get to the place where I can apply text over that image without it wrapping or doing something strange?

Welcome to the forums, @dennishastings2.

The easiest way would be to put the text in the HTML, rather than the image, and then apply the image to it as a background.

If you are going to insert the image in the HTML, then

<img src="klikitathead.jpg;" style="width:100%;" style="height:auto;" alt="klikitat art"/>

would be better as

<img src="klikitathead.jpg;" width="500" height="200" alt="klikitat art"/>

(using the actual pixel dimensions, of course) and then use CSS to display it as you wish.

This topic was automatically closed 91 days after the last reply. New replies are no longer allowed.