DIVの要素の座標をjs、css、html

Question

で設定すると、ジャーナルの問題をグラフィック表示します。私が必要とするのは、問題のページで整理された方法とまったく同じように、他のDIVの内部に単純なDIV（または他のもの）を使用してテキストブロックを表示することです。これを行うには、DIV要素の座標を正確な数値に設定する必要がありますが、親DIVに関連して設定する必要があります。 cssやjsを使ってこれを行う方法はありますか？

Answer 1

外側のdivがposition: relativeに設定されている場合は、内側のdivをposition: absoluteとし、top、left、rightおよびbottomプロパティを必要なピクセルに設定できます。例えば。

.outer { 
 
     position: relative; 
 
    } 
 

 
    .inner { 
 
     position: absolute; 
 
     top: 10px; //your coordinate 
 
     left: 5px; //your coordinate 
 
    }

<div class="outer"> 
 
     <div class="inner">Your content</div> 
 
</div> 
 

 

そうでない場合、あなたは単に内部要素のパディングを使用することができます。

Answer 2

divをdisplay: block;にする場合は、単純なmargin-topとmargin-leftを使用して座標を設定できます。

>あなたは< 100,50としてdivの座標を設定する必要があります（たとえば）と言うことができます：、CSSで、margin-left: 100pxとmargin-top: 50px