473,386 Members | 1,699 Online
Bytes | Software Development & Data Engineering Community
Post Job

Home Posts Topics Members FAQ

Join Bytes to post your question to a community of 473,386 software developers and data experts.

Get text width

Hi! I have a text and I need to get its width in pixels. The font size is
not fixed. I've been suggested to put the text inside of an invisible div
and get the div's width. But I would need to force the div to shrink to fit
the text. Any idea?

Thanks in advance
Jul 23 '05 #1
2 9699
I answer my own question: it's better to use a span element.

function getElementWidth(Elem) {
if(document.getElementById) {
var elem = document.getElementById(Elem);
} else if (document.all){
var elem = document.all[Elem];
}
xPos = elem.offsetWidth;
return xPos;
}

<span id="test">asdfasdf</span>

alert(getElementWidth(test)) -> gets the span width
"Showtime" <di***************@usuarios.retecal.es> escribió en el mensaje
news:37*************@individual.net...
Hi! I have a text and I need to get its width in pixels. The font size is
not fixed. I've been suggested to put the text inside of an invisible div
and get the div's width. But I would need to force the div to shrink to fit the text. Any idea?

Thanks in advance

Jul 23 '05 #2
Showtime wrote:
I answer my own question: it's better to use a span element.

function getElementWidth(Elem) {
if(document.getElementById) {
var elem = document.getElementById(Elem);
} else if (document.all){
var elem = document.all[Elem];
}
xPos = elem.offsetWidth;
return xPos;
}

<span id="test">asdfasdf</span>

alert(getElementWidth(test)) -> gets the span width


As a test case, why not:

<span onclick="alert(this.offsetWidth);">------</span>
For more information viewport features & issues, have a look
here:

<URL:http://www.quirksmode.org/viewport/compatibility.html>

--
Fred
Jul 23 '05 #3

This thread has been closed and replies have been disabled. Please start a new discussion.

Similar topics

4
by: j.t.w | last post by:
Hi All. I'm having a problem with my Date of Birth textbox. When I open the ..htm file, the "DoB" textbox is flat with a border. All of my other textboxes are sunken and are yellow. When I...
8
by: BiNZGi | last post by:
Hi I have reduced the problem to this code: <form> <table border="0" cellpadding="0" cellspacing="0" width="100%"> <tr> <td><input type="text" style="width: 100%;" value="Lorem ipsum dolor...
19
by: dmiller23462 | last post by:
Hi guys....I have absolutely NO IDEA what I'm doing with Javascript but my end result is I need two text boxes to stay hidden until a particular option is selected....I've cobbled together the...
2
by: george.leithead | last post by:
Hi all, I have a very strange problem! In following Web page (which is generated from a CMS System), the navigation to the left 'dissapears' when you roll the mouse over the links? It does not...
12
by: tim | last post by:
I am using foldoutmenu 3 and am having problems with viewing my menus in firefox. On my sub3 menus i have more than one line of text in some places. firefox does not recognise that there is more...
3
w33nie
by: w33nie | last post by:
I want to disable the text boxes, captain_name and captain_email, but only if the radio button, captain_guarantee, has NOT been checked. how do i do this? <form name="formTeamApplication"...
4
by: pablorp80 | last post by:
Hello, Here is what I need: I need the focus and the cursor set to a textbox named txtGT, every time no matter if it is the first page load or whether it is a postback. Here is the problem: I...
1
by: littlealex | last post by:
IE6 not displaying text correctly - IE 7 & Firefox 3 are fine! Need some help with this as fairly new to CSS! In IE6 the text for the following page doesn't display properly - rather than being...
1
by: semomaniz | last post by:
I have a form where i have created the form dynamically. First i manually added a panel control to the web page. Then i added another panel dynamically and inside this panel i created tables. I have...
0
by: taylorcarr | last post by:
A Canon printer is a smart device known for being advanced, efficient, and reliable. It is designed for home, office, and hybrid workspace use and can also be used for a variety of purposes. However,...
0
by: Charles Arthur | last post by:
How do i turn on java script on a villaon, callus and itel keypad mobile phone
0
by: ryjfgjl | last post by:
If we have dozens or hundreds of excel to import into the database, if we use the excel import function provided by database editors such as navicat, it will be extremely tedious and time-consuming...
0
by: ryjfgjl | last post by:
In our work, we often receive Excel tables with data in the same format. If we want to analyze these data, it can be difficult to analyze them because the data is spread across multiple Excel files...
0
BarryA
by: BarryA | last post by:
What are the essential steps and strategies outlined in the Data Structures and Algorithms (DSA) roadmap for aspiring data scientists? How can individuals effectively utilize this roadmap to progress...
0
by: Hystou | last post by:
There are some requirements for setting up RAID: 1. The motherboard and BIOS support RAID configuration. 2. The motherboard has 2 or more available SATA protocol SSD/HDD slots (including MSATA, M.2...
0
marktang
by: marktang | last post by:
ONU (Optical Network Unit) is one of the key components for providing high-speed Internet services. Its primary function is to act as an endpoint device located at the user's premises. However,...
0
Oralloy
by: Oralloy | last post by:
Hello folks, I am unable to find appropriate documentation on the type promotion of bit-fields when using the generalised comparison operator "<=>". The problem is that using the GNU compilers,...
0
jinu1996
by: jinu1996 | last post by:
In today's digital age, having a compelling online presence is paramount for businesses aiming to thrive in a competitive landscape. At the heart of this digital strategy lies an intricately woven...

By using Bytes.com and it's services, you agree to our Privacy Policy and Terms of Use.

To disable or enable advertisements and analytics tracking please visit the manage ads & tracking page.