Re: grid template rows

Path	csiph.com!weretis.net!feeder7.news.weretis.net!news.roellig-ltd.de!open-news-network.org!news4.open-news-network.org!.POSTED.8.229.197.178.dynamic.wless.zhbmb00p-cgnat.res.cust.swisscom.ch!not-for-mail
From	Thomas 'PointedEars' Lahn <PointedEars@web.de>
Newsgroups	comp.lang.javascript
Subject	Re: grid template rows
Date	Mon, 19 Aug 2019 15:19:24 +0200
Organization	PointedEars Software (PES)
Lines	49
Message-ID	<1637788.VLH7GnMWUR@PointedEars.de> (permalink)
References	<Wt6dnaJkUdZ1k8fAnZ2dnUU7-TfNnZ2d@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	news4.open-news-network.org; posting-host="8.229.197.178.dynamic.wless.zhbmb00p-cgnat.res.cust.swisscom.ch:178.197.229.8"; logging-data="6378"; mail-complaints-to="usenet@exeter.123backup.de"
User-Agent	KNode/4.14.10
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
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==
Xref	csiph.com comp.lang.javascript:37151

Show key headers only | View raw

Andrew Poulos wrote:

> With this HTML
> 
> <div id="container" style="grid-template-rows: 63px 42px 1fr 32px;">
> 
> console.log(container.style.gridTemplateRows);
> 
> gives "64px 32px 1fr 32px;"

Probably not.  The delimiting semicolon is not supposed to be part of the 
property value.

> But with this
> 
> #container {
>    grid-template-rows: 64px 32px 1fr 32px;
> }
> 
> <div id="container">
> 
> let con = document.getElementById('container');
> console.log( window.getComputedStyle(con,
> null).getPropertyValue("grid-template-rows") );
> 
> gives "64px 32px 497px 32px;"

Probably not.  Same reason as above.

> That is, the third value is a pixel value instead of 1fr.

I cannot reproduce that in navigator.userAgent === "Mozilla/5.0 (X11; Linux 
x86_64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/73.0.3683.75 
Safari/537.36".

> How can I get the actual value as set in the CSS and not the pixel values?

The only other way I know that might work in your case is to read the 
stylesheet directly.

> I need to manipulate the value for grid-template-rows and the moment I
> get the value, any fr unit is lost and the layout breaks.

You can store the current “fr” value elsewhere.

-- 
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.

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

Thread

grid template rows Andrew Poulos <ap_prog@hotmail.com> - 2019-08-19 12:52 +1000
  Re: grid template rows Arno Welzel <usenet@arnowelzel.de> - 2019-08-19 12:24 +0200
  Re: grid template rows Thomas 'PointedEars' Lahn <PointedEars@web.de> - 2019-08-19 15:19 +0200

csiph-web