CSS rotation reset

i'm currently making a circular menu with icons that pop up when you hover your mouse over a certain area. This part works well, however, things go wrong when i try to display a text in the center of that area when hovering over one of the said icons. The text is using the icon rotation and translation. ![http://i.stack.imgur.com/ATgYR.jpg](http://i.stack.imgur.com/ATgYR.jpg) Here's the (relevant part of the) code: **HTML**
  • This is a dummy text
**CSS** .holder { position:relative; margin:auto; float: left; } .holder a { position:absolute; } ul.icons {margin:100px; list-style:none; width:0px; height:50px; position:absolute; left: 8px; border:160px solid transparent; -webkit-border-radius: 200px; border-radius: 200px; } .tooltip { display: none; } ul.icons > li:hover .tooltip{ display: block; }
How about transform-origin?

以上就是CSS rotation reset的详细内容,更多请关注web前端其它相关文章!

赞(0) 打赏
未经允许不得转载:web前端首页 » CSS3 答疑

评论 抢沙发

  • 昵称 (必填)
  • 邮箱 (必填)
  • 网址

前端开发相关广告投放 更专业 更精准