Jquery 引导:图像上的文本覆盖粘贴在左侧

Jquery 引导:图像上的文本覆盖粘贴在左侧,jquery,html,css,twitter-bootstrap,Jquery,Html,Css,Twitter Bootstrap,我对这个很陌生,但我设法在我的图像上添加了一个标题,周围是一个黑匣子(我是多么想要它),但是带有文本的黑匣子(宽度为70%)似乎粘在了图像的左侧 <div class="row"> <div class="text-center" style="position: relative"> <img src="http://i.imgur.com/84AfU5A.jp

我对这个很陌生,但我设法在我的图像上添加了一个标题,周围是一个黑匣子(我是多么想要它),但是带有文本的黑匣子(宽度为70%)似乎粘在了图像的左侧

        <div class="row">
                    <div class="text-center" style="position: relative">
                        <img src="http://i.imgur.com/84AfU5A.jpg" alt="" class="img-responsive center-block" style="border-radius: 25px; ">
                            <div class="caption" style="position: absolute; top: 55%; width:70%; background-color: black; opacity: 0.5">
                      <p style="color: white !important; opacity: 1 !important">“Text Text Text Text</p>
                </div>
         </div>
</div>

“文本


如果这是一个非常明显的修复,我深表歉意。

只需将左侧css属性添加到标题div中,您就可以了。 在我下面的例子中,我加了左:5%


“文本