Some bullets cut-off in widgets
www.anythinggoesgourmet.com
a finally got rid of the vertical gray bars in the right side bar using the following code. /* Setup bullets for LI items on sidebar */ div.widget ul { list-style-type: none !important; } div.widget ul li a:link, div.widget ul li a:visited, div.widget ul li a:active, div.widget ul li a:hover { border-left: 0 !important; padding-left: 0 !important; } /* Normal bullet */ div.widget ul li { border-left: 0 !important; padding-left: 15px !important; background: url(/wp-content/themes/atahualpa/images/bullets/TinyRedBullet.GIF) no-repeat 0 1.0em; } /* On hover bullet */ div.widget ul li:hover, div.widget ul li.sfhover { border-left: 0 !important; padding-left: 15px !important; background: url(/wp-content/themes/atahualpa/images/bullets/TinyRedBullet.GIF) no-repeat 0 1.0em; } /***************************************/ However, I've obviously done something else along the way here and I don't remember what or where. The bullet is dropping down below the line on the first 4 posts/categories, showing only about 10% of the top of the image. Yet, a couple of the items do show 100% of the image. Any ideas? (newbie alert - KISS for me, please?) |
background: url(/wp-content/themes/atahualpa/images/bullets/TinyRedBullet.GIF) no-repeat 0 1.0em;
0 1.0em means "0 to the right, 1em to the bottom" or in other words "0 on the X-Axis (horizontal), 1em on the Y-axis (vertical)", always starting at the top left corner. Use background: url(/wp-content/themes/atahualpa/images/bullets/TinyRedBullet.GIF) no-repeat left top; Or to be even more CSS-conform: background: url(/wp-content/themes/atahualpa/images/bullets/TinyRedBullet.GIF) no-repeat scroll left top; "scroll" is the default setting (opposed to "fixed") and can usually be left out |
Thanks Flynn for the quick and complete reply. However, now I've lost my bullets entirely. The code in the CSS/Inserts reads:
/* Setup bullets for LI items on sidebar */ div.widget ul { list-style-type: none !important; } div.widget ul li a:link, div.widget ul li a:visited, div.widget ul li a:active, div.widget ul li a:hover { border-left: 0 !important; padding-left: 0 !important; } /* Normal bullet */ div.widget ul li { border-left: 0 !important; padding-left: 15px !important; background: url(/wp-content/themes/atahualpa/images/bullets/TinyRedBullet.GIF) no-repeat left-top; } /* On hover bullet */ div.widget ul li:hover, div.widget ul li.sfhover { border-left: 0 !important; padding-left: 15px !important; background: url(/wp-content/themes/atahualpa/images/bullets/TinyRedBullet.GIF) no-repeat left-top; } /***************************************/ I also tried it using the word 'scroll' as your other example showed. Same result. BTW, I have also reset the left margin on all three widget list items to zero, which I thought I had to do to get the bullets. any ideas? (seems like a lot of people have trouble with those gray vertical bars. Maybe some choices could become an option in a future update? Great theme, and thanks again.) |
You've put a dash into left-top
|
All times are GMT -6. The time now is 09:17 PM. |
Powered by vBulletin® Copyright ©2000 - 2024, Jelsoft Enterprises Ltd.