473,320 Members | 1,939 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,320 software developers and data experts.

white-space nowrap

I'm trying to layout a couple text input fields and their
corresponding labels without using a table. When I was trying to
debug my understanding of CSS, I was *very* surprised to see that
span's with borders behave counter-intuitively (IMHO) when using
style="white-space: nowrap;".

Below is a fairly small chunk of XHTML that demonstrates what I'm
talking about. What gives?

-Mark

--------------snip----------------
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html>

<head>
<meta http-equiv="Content-Type" content="text/html;
charset=windows-1252" />
<meta http-equiv="Content-Style-Type" content="text/css" />
<title>HTML 4.01 &amp; CSS 2.0 Test Page</title>
</head>

<body>

<div>
<h1>&ldquo;nowrap&rdquo; Test</h1>
Here&rsquo;s a test of a <b>div</b> with style=&quot;white-space:
nowrap;&quot;: <hr />
<div style="white-space: nowrap; border: 1px solid black;">
Line 1<br />
Line 2</div>
<hr />So far, so good.<br />
<br />
Here&rsquo;s the same thing using a <b>span</b> with
style=&quot;white-space: nowrap;&quot;:
<hr /><span style="white-space: nowrap; border: 1px solid
black;">Line 1<br />
Line 2</span> <hr />Why is the border so foobar&rsquo;d? I would have
expected the
span to be enclosed in a box.<br />
<br />
In FP 2003 it previews with no border at all. In IE6 and Opera 7.23
the border
encloses the top, left, and bottom of line 1 and the top, bottom, and
right
of line 2.<br />
<br />
<br />
What I&rsquo;m trying to do: <hr />
<form action="css-sample.html">
<div style="white-space: nowrap; display: inline;">
<input type="text" size="10" id="First1" /><br />
<label for="First1" style="font-size: xx-small;">First</label></div>
<div style="white-space: nowrap; display: inline;">
<input type="text" size="10" id="Last1" /><br />
<label for="Last1" style="font-size: xx-small;">Last</label></div>
</form>
<hr /><br />
<br />
What I&rsquo;m forced to do: <hr />
<form action="css-sample.html">
<table style="border-collapse: collapse" cellspacing="0"
cellpadding="0">
<tbody>
<tr>
<td><input type="text" size="10" id="First2" /><br />
<label for="First2" style="font-size:
xx-small;">First</label></td>
<td><input type="text" size="10" id="Last2" /><br />
<label for="Last2" style="font-size: xx-small;">Last</label></td>
</tr>
</tbody>
</table>
</form>
<hr /></div>

</body>

</html>
Jul 20 '05 #1
0 15152

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

Similar topics

5
by: qwweeeit | last post by:
Hi all, I need to limit as much as possible the lenght of a source line, stripping white spaces (except indentation). For example: .. . max_move and AC_RowStack.acceptsCards ( self,...
1
by: Bob Bedford | last post by:
I've about 50`000 jpg images on a dir. Some images have a white frame, other only 2 white lines, sometimes vertically, sometimes horizontally. I've to show those image on a darkgrey background,...
11
by: gopal srinivasan | last post by:
Hi, I have a text like this - "This is a message containing tabs and white spaces" Now this text contains tabs and white spaces. I want remove the tabs and white...
2
by: headware | last post by:
I've been getting a strange bug occurring in my ASP.NET pages. If while waiting for a page to load, the user clicks a dropdown listbox that causes postbacks, the whole screen turns white and it...
11
by: Dennis D. | last post by:
Back a few decades the proper way to learn a language began with a white paper. Do they exist for dot net, or would a person begin by studying the compiler specs? Guess what I'm asking is: Where...
7
by: marfi95 | last post by:
I'm trying to implement some code in vb.net to allow the user to adjust the brightness or contrast on an image (through the use of a slider) that is already black & white in the bitmap. I have...
9
by: martin1 | last post by:
Hi, All, how to flash button with 2 color( eg. red and white)? then when user click button, the button stop flash and stay red color? Thanks
1
by: bmjnine | last post by:
Hi all, I am converting image files of various formats to JPEG using: System.Drawing.Image img = System.Drawing.Image.FromFile(myfilepath); Works great except that transparent GIF's are over...
2
by: origenes | last post by:
Hi forum, Below is a sample code that creates a "white" gif image. I want to know... why the background result color is FEFCFE intead of white (FFFFFF)? When I use imagecreate instead of...
3
by: ayan4u | last post by:
well i need to deal with white spaces in charecter arrays... with static arrays its fine.. char ss; cin.getline(ss, sizeof ss); .... //deals with white spaces
0
by: ryjfgjl | last post by:
ExcelToDatabase: batch import excel into database automatically...
0
isladogs
by: isladogs | last post by:
The next Access Europe meeting will be on Wednesday 6 Mar 2024 starting at 18:00 UK time (6PM UTC) and finishing at about 19:15 (7.15PM). In this month's session, we are pleased to welcome back...
1
isladogs
by: isladogs | last post by:
The next Access Europe meeting will be on Wednesday 6 Mar 2024 starting at 18:00 UK time (6PM UTC) and finishing at about 19:15 (7.15PM). In this month's session, we are pleased to welcome back...
0
by: Vimpel783 | last post by:
Hello! Guys, I found this code on the Internet, but I need to modify it a little. It works well, the problem is this: Data is sent from only one cell, in this case B5, but it is necessary that data...
0
by: CloudSolutions | last post by:
Introduction: For many beginners and individual users, requiring a credit card and email registration may pose a barrier when starting to use cloud servers. However, some cloud server providers now...
0
by: Defcon1945 | last post by:
I'm trying to learn Python using Pycharm but import shutil doesn't work
1
by: Shællîpôpï 09 | last post by:
If u are using a keypad phone, how do u turn on JavaScript, to access features like WhatsApp, Facebook, Instagram....
0
by: af34tf | last post by:
Hi Guys, I have a domain whose name is BytesLimited.com, and I want to sell it. Does anyone know about platforms that allow me to list my domain in auction for free. Thank you
0
by: Faith0G | last post by:
I am starting a new it consulting business and it's been a while since I setup a new website. Is wordpress still the best web based software for hosting a 5 page website? The webpages will be...

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.