[thelist] [CSS] div width and white-space: nowrap

[Adrian Gonzales]

I'm not sure what you are asking, maybe this:

div#errorBox {
	border: 1px solid #FF0033;	
	width: 100%;
	margin-top: 10px;
	margin-bottom: 10px;
}


h5#errorHeader {
	color: #FFFFFF;
	background-color: #FF0033;
	margin: 0px;
	padding: 4px;
	display: run-in;
}

div#errorInnerBox {
	padding: 4px;
	white-space: nowrap;
}


Adrian Gonzales Jr.
Creative Director
Clear Span Media
clearspanmedia.com


-----Original Message-----
From: thelist-bounces at lists.evolt.org
[mailto:thelist-bounces at lists.evolt.org] On Behalf Of Mark M
Sent: Wednesday, March 31, 2004 8:21 PM
To: thelist at lists.evolt.org
Subject: [thelist] [CSS] div width and white-space: nowrap


Hey all - 

Got a CSS prob. Using XHTML :o)

Got a little box that I dynamically populate with an error message.

No biggie there.

(It's on an intranet, so you can't see it - sorry!)

It has a header across the top that says 'Error', which has a background
of red, and *should 
be* 100% of the way across.

Now, I don't want the error message to wrap, but stretch the div.

The code I am using is as follows:

HTML:

<div id="errorBox">
<h5 id="errorHeader">Error</h5>
<div id="errorInnerBox">
There was a problem with the login details for User ID 'fsad'. <br/>
</div> </div>

CSS:

div#errorBox {
	border: 1px solid #FF0033;	
	width: 10%;
	margin-top: 10px;
	margin-bottom: 10px;
}


h5#errorHeader {
	color: #FFFFFF;
	width: 100%;
	background-color: #FF0033;
	margin: 0px;
	padding: 4px;
	display: run-in;
}

div#errorInnerBox {
	padding: 4px;
	white-space: nowrap;
}

The problem is - the h5 element's width is wrapped to the 10% mark,
whereas the rest of the 
div stretches out.

Any help how I can make it so that the h5 is 100% wide like it's
supposed to be?

Cheers,

Mark

------------------------------------------------------------------
mark at safefrombees.com
ICQ: 3094740
Safe From Bees
[ www.safefrombees.com ]



-- 
* * Please support the community that supports you.  * *
http://evolt.org/help_support_evolt/

For unsubscribe and other options, including the Tip Harvester 
and archives of thelist go to: http://lists.evolt.org 
Workers of the Web, evolt !