Path: csiph.com!aioe.org!news.mixmin.net!weretis.net!feeder4.news.weretis.net!feeder5.news.weretis.net!news.solani.org!.POSTED!not-for-mail
From: Thomas 'PointedEars' Lahn <PointedEars@web.de>
Newsgroups: comp.lang.javascript
Subject: Re: Is there a quick way (simple syntax) to place a new DOM element vertically below instead of Horizontal (to the right)?
Date: Wed, 16 Nov 2016 13:38:54 +0100
Organization: PointedEars Software (PES)
Lines: 58
Message-ID: <40009118.fMDQidcC6G@PointedEars.de>
References: <520f9d34-7e8b-42f3-b35a-7868ed850dba@googlegroups.com> <1b8x6zxmkoqsv.fmhgem6julyi.dlg@40tude.net>
Reply-To: Thomas 'PointedEars' Lahn <cljs@PointedEars.de>
Mime-Version: 1.0
Content-Type: text/plain; charset="UTF-8"
Content-Transfer-Encoding: 8Bit
X-Trace: solani.org 1479299935 7369 eJwFwYEBwCAIA7CXhrTAzlGw/59gQg+LTgQDFKU4Saeq8rejqLmDvAtDYVB77fYy/9qtafkAHcAQ4Q== (16 Nov 2016 12:38:55 GMT)
X-Complaints-To: abuse@news.solani.org
NNTP-Posting-Date: Wed, 16 Nov 2016 12:38:55 +0000 (UTC)
User-Agent: KNode/4.14.2
X-NNTP-Posting-Host: eJwFwQkBwDAIA0BLPCEUOYwW/xJ2F07lJBhEbOzV3LHUtgmvmO9IHYFCPLnbCZ9WPrHp+1A/D2kQyA==
X-User-ID: eJwNwoENwDAIA7CXiAIBzuno+P+ETXZQ0KQr5LE/x1OarfZZJY3BvWwks7cZ58Bpqn6H7iKw6rWLQJy2DyeYE/c=
Cancel-Lock: sha1:UIdWl2iUL2f+0GZ32/tVEt7HG70=
Xref: csiph.com comp.lang.javascript:31729

JJ wrote:
^^
Your real name belongs there.

> On Tue, 15 Nov 2016 18:04:56 -0800 (PST), justaguy wrote:
>> [Is there a quick way (simple syntax) to place a new DOM element 
>> vertically below instead of Horizontal (to the right)?]
>> span or div. Or finding x, y coordinates and then placing a new element
>> at such coordinates is the only option to do it?
>> Table's TR seems one option.
> 
> There's no quick/simple way.

IBTD.

> If you just want to do everything as simple as possible, use a library.

This problem can probably be solved using CSS only:

  .foo {
    position: relative;
  }

  .foo .bar {
    position: absolute; /* or “fixed” */
    bottom: 0;
  }

Scripting it would not require a library:

  ancestor.style.position = "relative";

  var element = document.createElement("baz");
  element.style.position = "absolute"; /* or "fixed" */
  element.style.bottom = "0";
  element.appendChild(document.createTextNode("blub"));

  parentNode.appendChild(element);

(possibility: ancestor === parentNode)

Alternatively, one can set the “className” property of the relevant element 
objects, or use the “classList” property to add() class names, and apply the 
stylesheet above by making it the content of a newly created and inserted 
“style” element:

  var style = document.createElement("style");
  style.type = "text/css";
  style.appendChild(document.createTextNode(".foo …"));

  (document.head || document.getElementsByTagName("head")[0])
    .appendChild(style);

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