Groups | Search | Server Info | Keyboard shortcuts | Login | Register [http] [https] [nntp] [nntps]

Groups > comp.lang.javascript > #14233

Re: Shading a <div>

Followups directed to: comp.infosystems.www.authoring.stylesheets

Show all headers | View raw

Tom de Neef wrote:

> "Thomas 'PointedEars' Lahn" <PointedEars@web.de> schreef in bericht
> news:1750700.sGQGJBOIHu@PointedEars.de...
>> Tom de Neef wrote:
>>
>>> [.]
>>> Shading the whole client area apart from the focal <div> is not an
>>> option.
>>> It should be per <div>.
>>>
>>> I know how to make a <div> element semi-transparent. And I know how to
>>> add
>>> such a veil to the document and position it over a target <div>.
>>> But I would like it to be 'attached to' the target <div> so that it
>>> stays over it even when the target div resizes or moves (e.g. as a
>>> result of window resizing or server instructions).
>>> Can you think of an elegant way to do this and give suggestions, please.
>>
>> Position the target `div' element relative and the blocking `div' element
>> absolute as its child with left: 0, right: 0, top: 0, bottom: 0.
>>
>> Did I miss anything?
> 
> I have never seen this spec of  (0,0,0,0).

Standard CSS.  But a rectangle with coordinates (0, 0, 0, 0) is _not_ what 
it means.  RTFM.

> In Chrome and FF it does what
> you predicted: the child takes all space offered by the parent.
> Not so in IE8: the child uses only what is needed (e.g. for a &nbsp;).

It should work in IE 7 and 8, too (IE/MSHTML 6 supports `right' and `bottom' 
differently; use CCs).  Do not develop in Quirks Mode and remember that you 
must also use the `position' property *twice* (on different elements, with 
different values).

> But "top:0;left:0;width:100%;height:100%;" seems to work in all browsers.

Until you add padding it might.  Usually width:100% and height:100% is a bit 
too large – there are scrollbars.

> Thank you.

You're welcome.  Next time, consider a CSS-only solution first, and post 
where that is on-topic.

F'up2 comp.infosystems.www.authoring.stylesheets

PointedEars
-- 
Danny Goodman's books are out of date and teach practices that are
positively harmful for cross-browser scripting.
  -- Richard Cornford, cljs, <cife6q$253$1$8300dec7@news.demon.co.uk> (2004)

Back to comp.lang.javascript | Previous | Next — Previous in thread | Find similar | Unroll thread

Thread

Shading a <div> "Tom de Neef" <tdeneef@qolor.nl> - 2012-05-29 22:52 +0200
  Re: Shading a <div> Thomas 'PointedEars' Lahn <PointedEars@web.de> - 2012-05-29 23:06 +0200
    Re: Shading a <div> "Tom de Neef" <tdeneef@qolor.nl> - 2012-05-29 23:35 +0200
      Re: Shading a <div> "Tom de Neef" <tdeneef@qolor.nl> - 2012-05-29 23:37 +0200
    Re: Shading a <div> "Tom de Neef" <tdeneef@qolor.nl> - 2012-05-30 09:13 +0200
      Re: Shading a <div> Thomas 'PointedEars' Lahn <PointedEars@web.de> - 2012-05-30 10:14 +0200

csiph-web