How the text gif file will not cover the background picture

Question

0.00/5 (No votes)

See more: (untagged)

Does anyone can tell me why my "text gif file" cover the background picture? I want to show text only on the background picture.
How to fix it? Thanks.

Posted 5-Aug-10 10:29am

taichikungfu

Add a Solution

4 solutions

Add a Solution

Add your solution here

Treat my content as plain text, not as HTML

Preview 0

…

Existing Members

Sign in to your account

...or Join us

Download, Vote, Comment, Publish.

Your Email
Password
Forgot your password?

Your Email
This email is in use. Do you need your password?
Optional Password

I have read and agree to the Terms of Service and Privacy Policy
Please subscribe me to the CodeProject newsletters

When answering a question please:

Read the question carefully.
Understand that English isn't everyone's first language so be lenient of bad spelling and grammar.
If a question is poorly phrased then either ask for clarification, ignore it, or edit the question and fix the problem. Insults are not welcome.
Don't tell someone to read the manual. Chances are they have and don't get it. Provide an answer or move on to the next question.

Let's work to help developers, not make them feel stupid.

This content, along with any associated source code and files, is licensed under The Code Project Open License (CPOL)

AspDotNetDev · Answer 1 · 2010-08-05T11:56:00

Solution 1

Perhaps your GIF background isn't transparent. Or maybe the browser you are using doesn't support GIF transparency.

Posted 5-Aug-10 11:56am

AspDotNetDev

Comments

taichikungfu 6-Aug-10 13:16pm

Thank you aspdotnetdev, I use Paint edit my Gif file to be transparent.
It is not working. Please advise.

AspDotNetDev 6-Aug-10 13:51pm

Paint doesn't support transparency, so I don't understand how you think you are setting the transparency in Paint. Use one of the other free image editors that does support transparency, such as Paint.Net or GIMP.

taichikungfu 6-Aug-10 20:00pm

Thank you very much. My question is not just create a image has a layer transparence. I try to design a web page has a background picture, and I want my another text gif file image over the background image has text only without boundary.

AspDotNetDev 6-Aug-10 22:47pm

What do you mean by "without boundary"?

taichikungfu 7-Aug-10 0:29am

It means transparent. My result is just like when we add comments here, the orange is my background picture image, the comments is my text gif file and has white background boundary. I want my result "Do not" has white color instead of like the top line we can see the orange color. thank your help.

AspDotNetDev 7-Aug-10 1:14am

You lost me, but my answer is the same. What are you specifically having a problem with? The HTML to overlap images? Making the background of an image transparent? Did you already install Paint.Net or GIMP and make a transparent image? Did you try anything yourself already? If so, post the code you have and perhaps a link to an upload of the image and I can assist you further.

taichikungfu 8-Aug-10 0:02am

Yes, I install Paint.Net already. I think the keyword is "overlap". I created a logo "MY Craft Shop" three words only like "TheBeerHouse" if you know the E-commerce starter kit in ASP.Net. when I overlap the logo over the background image for example a group of hand-made purses, the logo words always has a rectangle block, that is not suposed to be. I do not know how to make a link to upload my image. plaese advise. Thanks.

AspDotNetDev · Answer 2 · 2010-08-07T19:20:00

Sounds like you are talking about image borders. This example shows how to remove them using CSS (a topic that is invaluable if you plan on doing any sort of serious web work):

HTML

<html>
<head>
	<style type="text/css">
		img
		{
			border-style: none;
		}
	</style>
</head>
<body>
	<a href="http://www.google.com/"><img src="img.png" /></a>
</body>
</html>

FYI, there are many websites that allow you to upload images. PhotoBucket is one of them. Also, you never posted any code. Next time you ask a question here, post some code that demonstrates the problem and you'll get a much quicker response.

taichikungfu · Answer 3 · 2010-08-08T17:16:00

Solution 3

My problem code

<body >
<div style="background-image: url ('App_Themes/DarkBeer/images/bh_header.png'); height: 109px; width: 798px;" >

<img style="border-style:none; width: 259px;" src="Images/MyCraftShop.gif"
height="109px" alt="logo" />

</div>
</body>

Posted 8-Aug-10 17:16pm

taichikungfu

Updated 8-Aug-10 17:18pm

v2

AspDotNetDev · Answer 4 · 2010-08-09T10:29:00

Looks like the problem is that your background image isn't loading at all. That's probably because you have a space between "url" and "(". This works for me: