Text on Buttons

[khalil]

I want to use buttons from another site and want to put some text on the buttons in HTML .
e.g Home , Back , next etc
Buttons are in cells of a table but i cant write text on the button(image)
Any Buddy would help me how can I put text on an image in a cell of a table

[Jlarini]

Hi!

You can put a <font> </font>, positioning this over the image.

JL

[khalil]

I tried <font> </font> But
How can I position the text on the image in <font> </font> .
It can not come on it.

Originally posted by Jlarini
Hi!

You can put a <font> </font>, positioning this over the image.

JL

[ober0330]

You would have to know the exact position of the image and then use a div or something place the text over the image. This seems very difficult when you could easily save the image, open it in an image editor, and add the text you want.

[Jop]

Give the td an unique id (id="myID")
then specify a background image via css:

#myID{
    background: url(myimage.jpg) center center no-repeat;
}

But it's not a good idea to use tables to layout your page, use divs instead.

[ober0330]

Originally posted by Jop
Give the td an unique id (id="myID")
then specify a background image via css:

#myID{
    background: url(myimage.jpg) center center no-repeat;
}

WHAT?? No. That creates a static background image. That does not allow him to position text over a specific image. Next time, read the problem before giving an answer.

[Jlarini]

Hi!

As ober0330 said, you must to know the exactly position to put that text over the image...


I suggest you use Interdev or Dreamweaver to do that, these will help you a lot. As Interdev is a M$ app, you'll need to pay for it... Dreamweaver from Macromedia has trial versions, so i think it's your best bet!

Dreamweaver will create the code with <div> and all more needed for you, so, you will just need to paste it on your desired place and, maybe, make some position ajusts...

JL

[Jop]

Originally posted by ober0330
WHAT?? No. That creates a static background image. That does not allow him to position text over a specific image. Next time, read the problem before giving an answer.

What are you talking about?

#button1{
	background: url(button1.jpg) center center no-repeat;
}

#button2{
	background: url(button2.jpg) center center no-repeat;
}

#button3{
	background: url(button3.jpg) center center no-repeat;
}

Would create 3 different buttons.
By using padding you will be able to 'absolutely position' your text (this might vary since some people have their text set to a larger size).

If you really need buttons that allways are the same, just use a graphics editor.

[ccoder]

The example on this page, Superimpose text over an image by using CSS-styled text, may be what you are looking for. I've used it for banners.