我如何让文字留在100%宽的div上? [英] How do I get text to stay in place over a 100% wide div?
本文介绍了我如何让文字留在100%宽的div上?的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!
问题描述
因此,我的页面上设置了100%宽度的标题,我希望在横幅上放置文本并保持原样,但是当放大和缩小文本更改的位置时。我怎样才能让文字保持在我设定的位置,放大和缩小并不影响它?
So I have a header which is set to 100% width on my page and I want to put text on the banner and stay in place but when I zoom in and out the position of the text changes. How do I make it so that the text stays place to the place I set it and zooming in and out does not affect it?
小提琴 : jsfiddle.net/5ASJv/
html
<div id="wrap">
<div class="right">
Hey <br />
What is up <br />
</div></div>
css
* {
margin: 0 auto;
}
#wrap {
height: 150px;
width: 100%;
background: url(http://froggyadventures.com/wp-content/uploads/galleries/post-93/full/placeholder%20-%20Copy%20(2).gif) no-repeat center;
text-align: center;
background-color: #FFF;
}
.right{
width: 400px;
height: 110px;
position: relative;
z-index: 999;
top: 100px;
left: 100px;
}
推荐答案
试试这个:
* {
margin: 0 auto;
}
#wrap {
height: 150px;
width: 100%;
background: url(http://froggyadventures.com/wp-content/uploads/galleries/post-93/full/placeholder%20-%20Copy%20(2).gif) no-repeat center;
text-align: center;
background-color: #FFF;
position: relative;
}
.right{
width: 400px;
height: 110px;
position: absolute;
z-index: 999;
top: 100px;
left: 100px;
}
这篇关于我如何让文字留在100%宽的div上?的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!
查看全文