CSS bullet

programming web dev
1

CSS questions…
[LIST=1]
[]How do you get rid of the indent that is automatically put into a bullet list?
[]How can I set different bullet graphics for different levels of indentation?
[*]How can I set only level-one indented text to be bold?
[/LIST]

2

Actually this is something that I want to know too… Nokrev?

3 

ul {
	margin: 0;
	padding: 0;
}



<ul class="level1">
	<li>
	<ul class="level2">
		<li>text</li>
		<li>text</li>
	</ul>
	</li>
</ul>

then use list-style-type in your css…


.level1 {
	font-weight: bold;
}
.level2 {
	font-weight: normal;
}
4

:lol: did I miss something?.. I’ve rarely seen Nokrev answer a client-side problem :wink:

5

to follow up, in the end, you might have something like this:


<html>
<head>
<style>
ul {
	margin: 0;
	padding: 0;
}
.level1 li {
	margin: 0 0 0 20px;
	font-weight: bold;
	list-style-type: circle;
}
.level2 li {
	margin: 0;
	font-weight: normal;
	list-style-type: square;
}
</style>
</head>
<body>
<ul class="level1">
	<li>Level 1
		<ul class="level2">
			<li>text</li>
			<li>text</li>
		</ul>
	</li>
</ul>

</body>
</html>
6

Your code works very well. The only problem is that my bullet graphics do not line up exactly with each line. Is there any way to tweak the position of the bullet?

7

change the margins on your list classes.

8

[ot]Thanks for the compliment. :lol:

I try and come here once in a while… mostly I just view “New Posts” ;)[/ot]