Solved

Easy Transparent GIF question

Posted on 2001-06-27
7
180 Views
Last Modified: 2010-04-09
What is the difference between inserting a transparent gif in a table to control placement of text over background graphics instead of simply using an empty cell to control it?
0
Comment
Question by:panrob
7 Comments
 
LVL 4

Accepted Solution

by:
CF_Spike earned 50 total points
Comment Utility
The difference is in the way different browsers render the HTML. Netscape for example will not necessarily render a table in exactly the same way as Internet Explorer. They will both, however render a gif the same way which is why a transparent gif is often used to ensure precise positioning. This is less true for modern browsers (versions 4,5 and 6) than it was for the older ones. If you know that you are supporting only version 4 browsers and above you may be able to do all the positioning with style sheets rather than tables or transparent gifs.

Spike
0
 
LVL 19

Expert Comment

by:DreamMaster
Comment Utility
Empty cells never use their set widths (especially not in Netscape...

There have been several solutions for this in the past and sometimes people still use them...amongst them is the tag <spacer> which was especially introduced for Netscape....

But because this is not browser independent people thought of the idea to use an image that is completely transparent....that way you can stretch a cell as far as you want it to without there being any contents....

When you leave the cell empty....it will be ok sometimes...but just imagine you need a line of 2px....you won't be able to get that using a non braking space....

Max.
0
 
LVL 19

Expert Comment

by:webwoman
Comment Utility
If you don't put something in a cell, Netscape collapses it -- you get no background image (if you set one), no background color, nothing -- basically, it's a hole in the table. If you have an entire row/column like that, for all intents and purposes it doesn't exist.

You can use a nbsp to hold the cell, but often that's too large either in height or width. So a transparent gif is used instead, because it can be set to an exact pixel size.
0
Free Trending Threat Insights Every Day

Enhance your security with threat intelligence from the web. Get trending threat insights on hackers, exploits, and suspicious IP addresses delivered to your inbox with our free Cyber Daily.

 
LVL 53

Expert Comment

by:COBOLdinosaur
Comment Utility
There is not really a single answer to the question. A cell in isolation
really has no context.  All of the suggestions may be appropriate for a
given circumstance.  What technique is best is dependent on the whole
table or even the whole page.  You cannot answer the question definitively
without reference to the context that the cell will be in, and what the
intended use of the cell is.

Cd&
0
 

Expert Comment

by:AlexisP
Comment Utility
I use all of the above based depending on the circumstance.  I use the non-breaking space when I have a larger cell that I need to keep open, the small gife when I am trying to create a single line within the document in a cell (makes good verticle lines by coloring the background of the cell and putting a 1X1 holder in.  I also reccommend using the older version of width and height allocation as well as a css version:
<td width="300" height="200" style="width:300px; height:200px">
still include atleast one non-breaking space in larger boxes to potentially elliminate collapse in older browsers.
0
 

Author Comment

by:panrob
Comment Utility
Thanks to everybody.   Great comments!
0
 
LVL 19

Expert Comment

by:DreamMaster
Comment Utility
You're welcome panrob...

Max.
0

Featured Post

Highfive Gives IT Their Time Back

Highfive is so simple that setting up every meeting room takes just minutes and every employee will be able to start or join a call from any room with ease. Never be called into a meeting just to get it started again. This is how video conferencing should work!

Join & Write a Comment

Suggested Solutions

Title # Comments Views Activity
Image not there 4 33
Compare site how does it work 4 49
Mobile version of website does not react 6 49
CSS grid style change 2 13
Popularity Can Be Measured Sometimes we deal with questions of popularity, and we need a way to collect opinions from our clients.  This article shows a simple teaching example of how we might elect a favorite color by letting our clients vote for …
Foreword (July, 2015) Since I first wrote this article, years ago, a great many more people have begun using the internet.  They are coming online from every part of the globe, learning, reading, shopping and spending money at an ever-increasing ra…
In this tutorial viewers will learn how to style transparent/translucent elements using alpha transparency in CSS Start with a normal styled element, such as a div.: Define its "background-color" property as "rgba (255, 255, 255, .5): The numbers in…
The viewer will learn how to create a basic form using some HTML5 and PHP for later processing. Set up your basic HTML file. Open your form tag and set the method and action attributes.: (CODE) Set up your first few inputs one for the name and …

771 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question

Need Help in Real-Time?

Connect with top rated Experts

10 Experts available now in Live!

Get 1:1 Help Now