replace "position: absolute" with "position: relative"

liunx

Guest
Hello

I'm playing around with XHtml and CSS, But i have come to a road block, i know there is a better way of doing this

Please look at
<!-- m --><a class="postlink" href="http://lj.funvill.com/dev/web/hover/">http://lj.funvill.com/dev/web/hover/</a><!-- m -->
and view the source.

I have to use position: absolute; to position each and every col and i have to declare 10 differnt col class,
What i want to do is use position: relative; some how so i can use one col class for all the rows

Any thoughts?

Thank you for your time.I am not quite clear what it is you are trying to achieve with your code. I.e. why specifically does it matter (e.g. code efficiency/reusability)?

Some quick thoughts:-

1. Why not put the specific positioning values directly in the divs themselves. I.e. instead of in the class declaration have

<div class="row col" style="top:150px; left:110px">

2. If you want to be able to move all of the columns and rows en-bloc, then as well as the first, put the DIVs in a separate containing div (e.g.):-

<div id=myContainer style="position:absolute; top:100px; left:100px; border:0; margin:0; padding:0">

<div class="row col" style="top:50px; left:10px"></div>

</div>

In IE at least, the top/left of the inner DIV is relative to the absolutely positioned outer div.

3. Why not generate the boxes on the fly through javascript, and then insert them.I鎶
 
Back
Top