How do I indent a side menu using javascript

[Francis Musyoki]

How do I indent a side menu as shown in the url's of http://www.fundimjanja.com/index.php?page_id=7&pcat=17, I am fetching information from a db, using the code

<td>
<select size="30" id = "cats" ONCHANGE="location = this.options[this.selectedIndex].value;">
<option value="0" disabled="disabled" >Fundi Category</option>
<?php
$i = 0;
foreach ( $category as $categories):
?>

<option value="<?php echo $categories->id; ?>" id= "category" ><?php echo $categories->name; ?></option>

<?php
foreach($subcategory as $subcategories):
if($subcategories->category_id == $categories->id):
?>
<option value="index.php?option=com_category&view=components&cartId=<?php echo $subcategories->id; ?>" id="subcategories" onload="Hide()"><?php echo $subcategories->name; ?></option>
<?php
endif;
endforeach;
?>
<?php
$i++;
endforeach;
?>
</select>
</td>

[Bruna Griebeler · Accepted solution]

Well you can use CSS instead of Java Script, either way is your choice.

If you want to use Java Script, You may create a function for it and call this function on the tags related to the menu.

A good method you can use is splice(). Here you have a complete example of that: http://stackoverflow.com/questions/1250639/indent-selected-text-with-javascript

Although if you decide to use CSS the text-indent can do the job: http://help.dottoro.com/ljxeqklb.php

Hope it helps!