Rocksolid Light

Welcome to novaBBS (click a section below)

mail  files  register  newsreader  groups  login

Message-ID:  

Genetics explains why you look like your father, and if you don't, why you should.


devel / comp.infosystems.www.authoring.stylesheets / Size element from grandparent

SubjectAuthor
* Size element from grandparentAndrew Poulos
+* Re: Size element from grandparentAndrew Poulos
|`- Re: Size element from grandparentPhilip Herlihy
+- Re: Size element from grandparentDr.Kral
+* Re: Size element from grandparentDr.Kral
|`- Re: Size element from grandparentDr.Kral
`- Re: Size element from grandparentThomas 'PointedEars' Lahn

1
Size element from grandparent

<hfCdnXjhAsaaj0X9nZ2dnUU7-RPNnZ2d@westnet.com.au>

 copy mid

https://www.novabbs.com/devel/article-flat.php?id=91&group=comp.infosystems.www.authoring.stylesheets#91

 copy link   Newsgroups: comp.infosystems.www.authoring.stylesheets
Path: i2pn2.org!i2pn.org!weretis.net!feeder6.news.weretis.net!news.snarked.org!border2.nntp.dca1.giganews.com!nntp.giganews.com!buffer2.nntp.dca1.giganews.com!nntp.westnet.com.au!news.westnet.com.au.POSTED!not-for-mail
NNTP-Posting-Date: Sun, 27 Jun 2021 00:52:07 -0500
Newsgroups: comp.infosystems.www.authoring.stylesheets
X-Mozilla-News-Host: news://news.iinet.net.au:119
From: ap_p...@hotmail.com (Andrew Poulos)
Subject: Size element from grandparent
Date: Sun, 27 Jun 2021 15:52:06 +1000
User-Agent: Mozilla/5.0 (Windows NT 10.0; Win64; x64; rv:78.0) Gecko/20100101
Thunderbird/78.11.0
MIME-Version: 1.0
Content-Type: text/plain; charset=utf-8; format=flowed
Content-Language: en-AU
Content-Transfer-Encoding: 7bit
Message-ID: <hfCdnXjhAsaaj0X9nZ2dnUU7-RPNnZ2d@westnet.com.au>
Lines: 20
X-Usenet-Provider: http://www.giganews.com
NNTP-Posting-Host: 203.221.138.97
X-Trace: sv3-EnPk7yB1IyOnMJmqbMnOcCL26wu7Vz/ZqezPX5sC5VECn0UxKSws3qAr9kosKIxfKZA2TW/UXszI22W!VMtVlhiX91bXsEwEDJzBy6dYyX3jWZLL1ILKEhK59Da76VzQH48umpn330xDH7GkWPgpHgm/DI3g!Nqf5Xgv2txRLOjfhH8H95Q==
X-Complaints-To: abuse@westnet.com.au
X-Abuse-and-DMCA-Info: Please be sure to forward a copy of ALL headers
X-Abuse-and-DMCA-Info: Otherwise we will be unable to process your complaint properly
X-Postfilter: 1.3.40
X-Original-Bytes: 1563
 by: Andrew Poulos - Sun, 27 Jun 2021 05:52 UTC

Is there a way to set the width and height of an element with respect to
a great grandparent (or higher) element?

The HTML looks a bit like this:

<body>
<div id="great-grandparent">
<div></div>

<div>
<div>
<div id="one"></div>
</div>
</div>
</div>
</body>

Set the size of "one" with respect to "great-grandparent".

Andrew Poulos

Re: Size element from grandparent

<5YmdnYBYXcWfiET9nZ2dnUU7-eHNnZ2d@westnet.com.au>

 copy mid

https://www.novabbs.com/devel/article-flat.php?id=92&group=comp.infosystems.www.authoring.stylesheets#92

 copy link   Newsgroups: comp.infosystems.www.authoring.stylesheets
Path: i2pn2.org!i2pn.org!paganini.bofh.team!news.dns-netz.com!news.freedyn.net!newsfeed.xs4all.nl!newsfeed7.news.xs4all.nl!tr3.eu1.usenetexpress.com!feeder.usenetexpress.com!tr3.iad1.usenetexpress.com!border1.nntp.dca1.giganews.com!nntp.giganews.com!buffer1.nntp.dca1.giganews.com!nntp.westnet.com.au!news.westnet.com.au.POSTED!not-for-mail
NNTP-Posting-Date: Sun, 27 Jun 2021 19:17:05 -0500
Subject: Re: Size element from grandparent
Newsgroups: comp.infosystems.www.authoring.stylesheets
References: <hfCdnXjhAsaaj0X9nZ2dnUU7-RPNnZ2d@westnet.com.au> <n93CI.59711$J21.7692@fx40.iad>
From: ap_p...@hotmail.com (Andrew Poulos)
Date: Mon, 28 Jun 2021 10:17:04 +1000
User-Agent: Mozilla/5.0 (Windows NT 10.0; Win64; x64; rv:78.0) Gecko/20100101 Thunderbird/78.11.0
MIME-Version: 1.0
In-Reply-To: <n93CI.59711$J21.7692@fx40.iad>
Content-Type: text/plain; charset=utf-8; format=flowed
Content-Language: en-AU
Content-Transfer-Encoding: 8bit
Message-ID: <5YmdnYBYXcWfiET9nZ2dnUU7-eHNnZ2d@westnet.com.au>
Lines: 19
X-Usenet-Provider: http://www.giganews.com
NNTP-Posting-Host: 203.221.138.97
X-Trace: sv3-WTxn733rPjyUizSbuMs9Xo6Sz7L5ljlHoqEm5SDAtrFPsf4ftmzxY74DXxKNk1nOHsDlcLbMs5M8FkD!4ciav3UIC+Wkw5jGan/gsXpP6J5KbXg0x9RkZdlheww+GcwNo7bVCwn92MOrja1+xDHoIjw2heTd!qz3QCg6NQAcUhm/8XkNtbQ==
X-Complaints-To: abuse@westnet.com.au
X-Abuse-and-DMCA-Info: Please be sure to forward a copy of ALL headers
X-Abuse-and-DMCA-Info: Otherwise we will be unable to process your complaint properly
X-Postfilter: 1.3.40
X-Original-Bytes: 1905
 by: Andrew Poulos - Mon, 28 Jun 2021 00:17 UTC

On 28/06/2021 4:09 am, 😉 Good Guy 😉 wrote:
> On 27/06/2021 06:52, Andrew Poulos wrote:
>>
>> Set the size of "one" with respect to "great-grandparent".
>>
>
> Just give it a size in percentage and see what happens.
>
>>         div#one {
>>             width: 50%;
>>             height: 20vh;
>>             background-color: tomato;
>>         }

First, doing it that way means the width is set with respect to its
parent and not it's great grand parent. Secondly, using vh for height
bears no relation to the size of the parents(s).

Andrew Poulos

Re: Size element from grandparent

<MPG.3b43ad964fc25833989954@news.eternal-september.org>

 copy mid

https://www.novabbs.com/devel/article-flat.php?id=93&group=comp.infosystems.www.authoring.stylesheets#93

 copy link   Newsgroups: comp.infosystems.www.authoring.stylesheets
Path: i2pn2.org!i2pn.org!eternal-september.org!reader02.eternal-september.org!.POSTED!not-for-mail
From: thiswill...@you.com (Philip Herlihy)
Newsgroups: comp.infosystems.www.authoring.stylesheets
Subject: Re: Size element from grandparent
Date: Mon, 28 Jun 2021 10:58:15 +0100
Organization: A noiseless patient Spider
Lines: 33
Message-ID: <MPG.3b43ad964fc25833989954@news.eternal-september.org>
References: <hfCdnXjhAsaaj0X9nZ2dnUU7-RPNnZ2d@westnet.com.au> <n93CI.59711$J21.7692@fx40.iad> <5YmdnYBYXcWfiET9nZ2dnUU7-eHNnZ2d@westnet.com.au>
Mime-Version: 1.0
Content-Type: text/plain; charset="iso-8859-15"
Content-Transfer-Encoding: 8bit
Injection-Info: reader02.eternal-september.org; posting-host="8dcf24ce33e0405a824cd8d37c9aa14b";
logging-data="17171"; mail-complaints-to="abuse@eternal-september.org"; posting-account="U2FsdGVkX18NZESmLHZ4f4Grb6lUCvlG+mcfGkRird0="
User-Agent: MicroPlanet-Gravity/3.0.10 (GRC)
Cancel-Lock: sha1:ogR2c+MygG7k6UZKxaTMMh0jVpI=
 by: Philip Herlihy - Mon, 28 Jun 2021 09:58 UTC

In article <5YmdnYBYXcWfiET9nZ2dnUU7-eHNnZ2d@westnet.com.au>,
ap_prog@hotmail.com says...
>
> On 28/06/2021 4:09 am, ? Good Guy ? wrote:
> > On 27/06/2021 06:52, Andrew Poulos wrote:
> >>
> >> Set the size of "one" with respect to "great-grandparent".
> >>
> >
> > Just give it a size in percentage and see what happens.
> >
> >>         div#one {
> >>             width: 50%;
> >>             height: 20vh;
> >>             background-color: tomato;
> >>         }
>
> First, doing it that way means the width is set with respect to its
> parent and not it's great grand parent. Secondly, using vh for height
> bears no relation to the size of the parents(s).
>
> Andrew Poulos

What you're looking for is "container queries". On the way, but not
implemented yet in any mainstream browser version.

https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_Container_Queries
https://css-tricks.com/say-hello-to-css-container-queries/
https://caniuse.com/css-container-queries -- NB!

--

Phil, London

Re: Size element from grandparent

<qc6kdglbdo6l7mcadd524htt7k7asiu56s@4ax.com>

 copy mid

https://www.novabbs.com/devel/article-flat.php?id=94&group=comp.infosystems.www.authoring.stylesheets#94

 copy link   Newsgroups: comp.infosystems.www.authoring.stylesheets
Path: i2pn2.org!i2pn.org!weretis.net!feeder8.news.weretis.net!feeder1.feed.usenet.farm!feed.usenet.farm!peer01.ams4!peer.am4.highwinds-media.com!peer03.iad!feed-me.highwinds-media.com!news.highwinds-media.com!fx20.iad.POSTED!not-for-mail
From: Dr.K...@nyc.rr.com
Newsgroups: comp.infosystems.www.authoring.stylesheets
Subject: Re: Size element from grandparent
Reply-To: Dr_Kral@nyc.rr.com
Message-ID: <qc6kdglbdo6l7mcadd524htt7k7asiu56s@4ax.com>
References: <hfCdnXjhAsaaj0X9nZ2dnUU7-RPNnZ2d@westnet.com.au>
X-Newsreader: Forte Agent 5.00/32.1171
MIME-Version: 1.0
Content-Type: text/plain; charset=us-ascii
Content-Transfer-Encoding: 7bit
X-Antivirus: Avast (VPS 210628-8, 6/28/2021), Outbound message
X-Antivirus-Status: Clean
Lines: 43
X-Complaints-To: abuse@easynews.com
Organization: Easynews - www.easynews.com
X-Complaints-Info: Please be sure to forward a copy of ALL headers otherwise we will be unable to process your complaint properly.
Date: Mon, 28 Jun 2021 14:58:47 -0400
X-Received-Bytes: 2088
 by: Dr.K...@nyc.rr.com - Mon, 28 Jun 2021 18:58 UTC

On Sun, 27 Jun 2021 15:52:06 +1000, Andrew Poulos <ap_prog@hotmail.com>
wrote in <hfCdnXjhAsaaj0X9nZ2dnUU7-RPNnZ2d@westnet.com.au>:

>Is there a way to set the width and height of an element with respect to
>a great grandparent (or higher) element?
>
>The HTML looks a bit like this:
>
><body>
> <div id="great-grandparent">
> <div></div>
>
> <div>
> <div>
> <div id="one"></div>
> </div>
> </div>
> </div>
></body>
>
>Set the size of "one" with respect to "great-grandparent".
>
>Andrew Poulos

If the grand-parent's width has been set, then

var w = document.getElementById('great-grandparent').style.width ;
var w1 = Number( w.replace(/[^\d]/g, "") ) ; //size
var w2 = w.replace(/\d/g, "") ; //unit
document.getElementById('one').style.width = (w1) * adjustment +w2;

If grand-parent's width has NOT been set, then create an invisible element
with the wanted width inside and use that which does require all the above
fussing.

Similarly for height.

K

--
This email has been checked for viruses by Avast antivirus software.
https://www.avast.com/antivirus

Re: Size element from grandparent

<828kdgpg878pnqurt6g5vdgvq73c8qqc43@4ax.com>

 copy mid

https://www.novabbs.com/devel/article-flat.php?id=95&group=comp.infosystems.www.authoring.stylesheets#95

 copy link   Newsgroups: comp.infosystems.www.authoring.stylesheets
Path: i2pn2.org!i2pn.org!usenet.goja.nl.eu.org!weretis.net!feeder8.news.weretis.net!newsreader4.netcologne.de!news.netcologne.de!peer01.ams1!peer.ams1.xlned.com!news.xlned.com!peer01.iad!feed-me.highwinds-media.com!news.highwinds-media.com!fx12.iad.POSTED!not-for-mail
From: Dr.K...@nyc.rr.com
Newsgroups: comp.infosystems.www.authoring.stylesheets
Subject: Re: Size element from grandparent
Reply-To: Dr_Kral@nyc.rr.com
Message-ID: <828kdgpg878pnqurt6g5vdgvq73c8qqc43@4ax.com>
References: <hfCdnXjhAsaaj0X9nZ2dnUU7-RPNnZ2d@westnet.com.au>
X-Newsreader: Forte Agent 5.00/32.1171
MIME-Version: 1.0
Content-Type: text/plain; charset=us-ascii
Content-Transfer-Encoding: 7bit
X-Antivirus: Avast (VPS 210628-8, 6/28/2021), Outbound message
X-Antivirus-Status: Clean
Lines: 46
X-Complaints-To: abuse@easynews.com
Organization: Easynews - www.easynews.com
X-Complaints-Info: Please be sure to forward a copy of ALL headers otherwise we will be unable to process your complaint properly.
Date: Mon, 28 Jun 2021 15:17:59 -0400
X-Received-Bytes: 2165
 by: Dr.K...@nyc.rr.com - Mon, 28 Jun 2021 19:17 UTC

On Sun, 27 Jun 2021 15:52:06 +1000, Andrew Poulos <ap_prog@hotmail.com>
wrote in <hfCdnXjhAsaaj0X9nZ2dnUU7-RPNnZ2d@westnet.com.au>:

>Is there a way to set the width and height of an element with respect to
>a great grandparent (or higher) element?
>
>The HTML looks a bit like this:
>
><body>
> <div id="great-grandparent">
> <div></div>
>
> <div>
> <div>
> <div id="one"></div>
> </div>
> </div>
> </div>
></body>
>
>Set the size of "one" with respect to "great-grandparent".
>
>Andrew Poulos
Corrected --

If the grand-parent's width has been set, then

var w = document.getElementById('great-grandparent').style.width ;
var w1 = Number( w.replace(/[^\d]/g, "") ) ; //size
var w2 = w.replace(/\d/g, "") ; //unit
document.getElementById('one').style.width = (w1) * adjustment +w2;

If grand-parent's width has NOT been set, then create an invisible element
with the wanted width inside and use that which does not require all the
above fussing.

The width unit must be physical rather than percentage.

Similarly for height.

K

--
This email has been checked for viruses by Avast antivirus software.
https://www.avast.com/antivirus

Re: Size element from grandparent

<mjtldgdf9d8u60aftn2jo8f8slt4kdst59@4ax.com>

 copy mid

https://www.novabbs.com/devel/article-flat.php?id=96&group=comp.infosystems.www.authoring.stylesheets#96

 copy link   Newsgroups: comp.infosystems.www.authoring.stylesheets
Path: i2pn2.org!i2pn.org!weretis.net!feeder8.news.weretis.net!news.mixmin.net!npeer.as286.net!npeer-ng0.as286.net!peer01.ams1!peer.ams1.xlned.com!news.xlned.com!peer03.iad!feed-me.highwinds-media.com!news.highwinds-media.com!fx44.iad.POSTED!not-for-mail
From: Dr.K...@nyc.rr.com
Newsgroups: comp.infosystems.www.authoring.stylesheets
Subject: Re: Size element from grandparent
Reply-To: Dr_Kral@nyc.rr.com
Message-ID: <mjtldgdf9d8u60aftn2jo8f8slt4kdst59@4ax.com>
References: <hfCdnXjhAsaaj0X9nZ2dnUU7-RPNnZ2d@westnet.com.au> <828kdgpg878pnqurt6g5vdgvq73c8qqc43@4ax.com>
X-Newsreader: Forte Agent 5.00/32.1171
MIME-Version: 1.0
Content-Type: text/plain; charset=us-ascii
Content-Transfer-Encoding: 7bit
X-Antivirus: Avast (VPS 210628-8, 6/28/2021), Outbound message
X-Antivirus-Status: Clean
Lines: 61
X-Complaints-To: abuse@easynews.com
Organization: Easynews - www.easynews.com
X-Complaints-Info: Please be sure to forward a copy of ALL headers otherwise we will be unable to process your complaint properly.
Date: Tue, 29 Jun 2021 06:34:48 -0400
X-Received-Bytes: 2810
 by: Dr.K...@nyc.rr.com - Tue, 29 Jun 2021 10:34 UTC

On Mon, 28 Jun 2021 15:17:59 -0400, Dr.Kral@nyc.rr.com wrote in
<828kdgpg878pnqurt6g5vdgvq73c8qqc43@4ax.com>:

>On Sun, 27 Jun 2021 15:52:06 +1000, Andrew Poulos <ap_prog@hotmail.com>
>wrote in <hfCdnXjhAsaaj0X9nZ2dnUU7-RPNnZ2d@westnet.com.au>:
>
>>Is there a way to set the width and height of an element with respect to
>>a great grandparent (or higher) element?
>>
>>The HTML looks a bit like this:
>>
>><body>
>> <div id="great-grandparent">
>> <div></div>
>>
>> <div>
>> <div>
>> <div id="one"></div>
>> </div>
>> </div>
>> </div>
>></body>
>>
>>Set the size of "one" with respect to "great-grandparent".
>>
>>Andrew Poulos
>Corrected --
>
>If the grand-parent's width has been set, then
>
> var w = document.getElementById('great-grandparent').style.width ;
> var w1 = Number( w.replace(/[^\d]/g, "") ) ; //size
> var w2 = w.replace(/\d/g, "") ; //unit
> document.getElementById('one').style.width = (w1) * adjustment +w2;
>
>If grand-parent's width has NOT been set, then create an invisible element
>with the wanted width inside and use that which does not require all the
>above fussing.
>
>The width unit must be physical rather than percentage.
>
>Similarly for height.

An even better way is to use getComputedStyle.

Assuming that the unit is two characters (probably px) then

var w = getComputedStyle ( document.getElementById('great-grandparent') ).
getPropertyValue('width') ;
document.getElementById('one').style.width =
Number(w.substr(0,w.length-2)) * adjustment + w.substr(-2) ;

which avoids two replaces using regexps. The number function is probably
redundant.

K

--
This email has been checked for viruses by Avast antivirus software.
https://www.avast.com/antivirus

Re: Size element from grandparent

<2068213.VL9Hh5JYRR@PointedEars.de>

 copy mid

https://www.novabbs.com/devel/article-flat.php?id=97&group=comp.infosystems.www.authoring.stylesheets#97

 copy link   Newsgroups: comp.infosystems.www.authoring.stylesheets
Path: i2pn2.org!i2pn.org!weretis.net!feeder8.news.weretis.net!news.mb-net.net!open-news-network.org!.POSTED.178.197.216.189!not-for-mail
From: PointedE...@web.de (Thomas 'PointedEars' Lahn)
Newsgroups: comp.infosystems.www.authoring.stylesheets
Subject: Re: Size element from grandparent
Date: Thu, 01 Jul 2021 20:04:15 +0200
Organization: PointedEars Software (PES)
Lines: 36
Message-ID: <2068213.VL9Hh5JYRR@PointedEars.de>
References: <hfCdnXjhAsaaj0X9nZ2dnUU7-RPNnZ2d@westnet.com.au>
Reply-To: Thomas 'PointedEars' Lahn <cljs@PointedEars.de>
Mime-Version: 1.0
Content-Type: text/plain; charset="UTF-8"
Content-Transfer-Encoding: 8Bit
Injection-Info: gwaiyur.mb-net.net; posting-host="178.197.216.189";
logging-data="886"; mail-complaints-to="abuse@open-news-network.org"
User-Agent: KNode/4.14.10
Cancel-Lock: sha1:rDpZljllkgfvtntPWBvjV3ok2rM=
Face: iVBORw0KGgoAAAANSUhEUgAAADAAAAAwBAMAAAClLOS0AAAAGFBMVEXTxa4RFk5dUWANED8PFEfy7+MGBiW+n3ZNF/QuAAACaElEQVQ4jVXUwVOcMBQG8Dc7Rc4PUntdWV2uxjDpGaGeozOp1woar4jd5t/v9wLstMwsA/ntlxdCAgUc1hjTc9/JCZfGoo3wG3HdmdAWrIJRHe7GM/TmpY5VFefuVcAkkPbLIaN8rmPmjloyZxgyR3GuJ4K0AGtJ2htz8o7yqikm759fldQXaMpbDzjKAG+8v+AugVTOPO5DOjLvGtUYQwh0CPjnVMyGd+8/GfUB5nLKJDD2aLDh5HYyMDJGDwQIo2ZmZcKbowNmAdB/AzyFhrmF2MHRb0QJJfaAnwGB6orZhoykLzJtGwF/xpYxI1dswomiUj3gTuAIqCn/4C7cULwGNBtwMTk3Y4LfKB5YUaOKBKYtpplm7u0vip8tU1NWWyI/7XdcSuIDoMt6rVHMWT0DbjHPGqDqZVSa6zleLcUTcIKLoMv3ueJluALtAo9B302zPPlrtiVScRdCjXvVh3e3JpYa/jjkuC9N+LrBMlz/eAN4eQijX2EdLo6c5tGGHwLyHFtXk89dDGHwCVhG9T0S/j55AhRZgkMCmUQXJ49TnS1wnQDvw0eAh9ICeMmEFbCnPMFzjAvsWoEWEFdYEx+S0MoUZ1gT1wId8+AF3Bl2OoEu906AUHx5VLw/gXYg/x84loOah/2UYNrgiwSwGO7RfUzVBbx/kgpckumGOi6QirtD6gkLTitbnxNol47S2jVc2vsN5kPqaAHT8uUdAJM4v/DanjYOwmUjWznGfwB7sGtAtor5BgofDuzaRj4kSQAqDakTsKORa3Q3xKi3gE1fhl71KRMqrdZ2AWNNg/YOhQyrVBnb+i+nEg4bsDA+egAAAABJRU5ErkJggg==
X-User-ID: U2FsdGVkX1+SvhwdSmffa9SY5UI0Kkby5uxsJk1AnJaw/O5jq2s2ig==
X-Face: %i>XG-yXR'\"2P/C_aO%~;2o~?g0pPKmbOw^=NT`tprDEf++D.m7"}HW6.#=U:?2GGctkL,f89@H46O$ASoW&?s}.k+&.<b';Md8`dH6iqhT)6C^.Px|[=M@7=Ik[_w<%n1Up"LPQNu2m8|L!/3iby{-]A+#YE}Kl{Cw$\U!kD%K}\2jz"QQP6Uqr],./"?;=4v
 by: Thomas 'Pointed - Thu, 1 Jul 2021 18:04 UTC

Andrew Poulos wrote:

> Is there a way to set the width and height of an element with respect to
> a great grandparent (or higher) element?
>
> The HTML looks a bit like this:
>
> <body>
> <div id="great-grandparent">
> <div></div>
>
> <div>
> <div>
> <div id="one"></div>
> </div>
> </div>
> </div>
> </body>
>
> Set the size of "one" with respect to "great-grandparent".

With standard CSS, an element with “position: absolute” will be sized based
on the next ancestor with a “position” value other than “static”, or the
viewport in the absence of such an ancestor. This applies at least to the
properties “left”, “top”, “right”, “bottom”, “width”, and “height”. The
“width” and “height” properties do not include the padding, though (except
in MSHTML < 7).

It can, of course, also be solved with scripting.

However, you may be attempting to solve the wrong problem.

--
PointedEars
FAQ: <http://PointedEars.de/faq> | <http://PointedEars.de/es-matrix>
<https://github.com/PointedEars> | <http://PointedEars.de/wsvn/>
Twitter: @PointedEars2 | Please do not cc me./Bitte keine Kopien per E-Mail.

1
server_pubkey.txt

rocksolid light 0.9.7
clearnet tor