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

[Mark M]

My bad - not clear enough

example can be seen at:
http://users.tpg.com.au/adslkm7b/list/

You see how the red background on the 'Error' title doesn't go all the way across.

I want it to, without losing the white-space: no wrap;.

I'm starting to think I may have to do it with a background image.

Mark

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


Quoting Adrian Gonzales <adrian at clearspanmedia.com>:

> 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 ! 
> 
> -- 
> * * 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 ! 
> 
> 
>