Thursday, 15 March 2012

Add a space between ul and li element created by JavaScript -



Add a space between ul and li element created by JavaScript -

been struggling problem now.

i have list behaves quite weird, , couldt find problem until firebugd , saw entire file prints out in 1 row.

something this.

<div class="clock-content-wrapper"><ul class="clock-digit-wrapper hour"><li class="clock-digit-one"></li><li class="clock-digit-three"></li></ul><ul class="clock-digit-wrapper minute"><li class="clock-digit-three"></li><li class="clock-digit-seven"></li></ul><ul class="clock-digit-wrapper second"><li class="clock-digit-zero"></li><li class="clock-digit-zero"></li></ul></div>

there no spaces between elements.

now didn't know problem started prepare elements in firebug this.

<div class="clock-content-wrapper"> <ul class="clock-digit-wrapper hour"> <li class="clock-digit-one"></li> <li class="clock-digit-three"></li> </ul> <ul class="clock-digit-wrapper minute"> <li class="clock-digit-three"></li> <li class="clock-digit-seven"></li> </ul> <ul class="clock-digit-wrapper second"> <li class="clock-digit-zero"></li> <li class="clock-digit-zero"></li> </ul> </div>

and notice if have </ul> element under </li> script works @ supposed to.

is there way construction file javascript ? have jsfiddle, can se differens between tree created in html , 1 javascript. http://jsfiddle.net/xk49c/

i dont want alter in css . since both html , js application using same css .

the problem is, when create elements using html, indent or separate elements 1 or more spaces, or new lines. html renders these spaces 1 single space , see space between elements.

to add together spaces between elements created javascript, either ll have add together padding left minute , second class, or insert text node between each ul

hours = createelementwithclass('ul', 'clock-digit-wrapper hour'); clock_toolbar_wrapper_close.appendchild(hours); clock_toolbar_wrapper_close.appendchild(document.createtextnode(' ')); // add together minutes = createelementwithclass('ul', 'clock-digit-wrapper minute'); clock_toolbar_wrapper_close.appendchild(minutes); clock_toolbar_wrapper_close.appendchild(document.createtextnode(' ')); // ,

javascript

No comments:

Post a Comment