2 replies [Last post]
archangel
Offline
newbie
Hannover, Germany
Last seen: 15 years 46 weeks ago
Hannover, Germany
Joined: 2004-09-27
Posts: 5
Points: 0

Hello!

I want to create a bulleted list with my own bullets. The bullet grahpics are bigger than the text and the text is aligned with the bottom of the image. I want it to be centered with the image.

I have already kludged together a solution with background-image and padding but it doesn't feel quite right. You can see it at http://www.gildehaus-hannover.de/listtest.htm (Menu 2).

Menu 1 (on the same page) was my first try, using list-style-image. I found it logical to use it but haven't found a solution to center the text.

Menu 3 is also a nice solution because the images are klickable. But again I could't find a solution on how to position the text like it want.

Can anyone help me to position the text in Menu 1 or (preferrably) in Menu 3 in the middle (vertically) of the image?

thepineapplehead
thepineapplehead's picture
Offline
Guru
Last seen: 21 weeks 9 hours ago
Joined: 2004-06-30
Posts: 9668
Points: 801

Big bullet images for lists

Try setting the line-height to that of the image, and set vertical-align to center.

Verschwindende wrote:
  • CSS doesn't make pies

archangel
Offline
newbie
Hannover, Germany
Last seen: 15 years 46 weeks ago
Hannover, Germany
Joined: 2004-09-27
Posts: 5
Points: 0

Big bullet images for lists

Hmm, have done that, but it didn't change anything. Have tried vertical-align:midde; and vertical-align:center;