Top 10 widget css styling
-
Hello, I am using Top 10 posts widget and works as advertised.
I applied the beautify code to the widget and now I almost got it the way I want it to be.
Notice the widget is published on the sidebar, I made the thumbs bigger but, as you can see, the titles are not aligned and it doesn’t look good. I would like to have the titles aligned on the middle of each image. Then I’ll probably make the text a tad bigger but that is easy. I tried mumbling around with the CSS but I cannot get it to work.
Could you please help me?
Thank y’all
Viewing 1 replies (of 1 total)
-
This is how it is now.
img.tptn_thumb { width: 125px !important; height: 125px !important; display: block; float: left; clear: left; margin-right: px !important; padding: 3px !important; border: 1px #CCCCCC solid; } .tptn_posts_daily ul li, .tptn_posts ul li { clear: both; min-height: px; margin: px 0 5px; display: inline-block; } .tptn_posts_daily ul, .tptn_posts ul { margin: 0 !important; padding: 0 !important; } .tptn_posts_daily .tptn_title, .tptn_posts .tptn_title { font-weight: bold; font-size: 14px; display: inline-block; float: right; padding-bottom: 5px; text-decoration: none; } img.tptn_thumb:after { content: ' '; width: 100%; height: 100%; position: absolute; top: -1px; left: -1px; border: solid 1px #222; -moz-box-shadow: inset 0 0 1px rgba(255,255,255,.4), inset 0 1px 0 rgba(255,255,255,.4), 0 1px 2px rgba(0,0,0,.3); box-shadow: inset 0 0 1px rgba(255,255,255,.4), inset 0 1px 0 rgba(255,255,255,.4), 0 1px 2px rgba(0,0,0,.3); -webkit-border-radius: 7px; -moz-border-radius: 7px; border-radius: 7px; } img.tptn_thumb { vertical-align: bottom; -webkit-box-shadow: 0 1px 2px rgba(0,0,0,.4); -moz-box-shadow: 0 1px 2px rgba(0,0,0,.4); box-shadow: 0 1px 2px rgba(0,0,0,.4); -webkit-border-radius: 7px; -moz-border-radius: 7px; border-radius: 7px; }
Viewing 1 replies (of 1 total)
- The topic ‘Top 10 widget css styling’ is closed to new replies.