画像のキャプションをスライダから外します

Question

私は大きな問題に直面しています。画像のキャプションをスライダから外したいと思います。 私はマスタースライダーを持っており、スライダーは自分のプロジェクトのイメージを表示します。 私が望むのは、各プロジェクトの名前をスライダーの下に置くことです（スライダーの内側にはない）。名前はイメージと相対的に変更する必要があります。 修正しようとしましたが、うまく動作しませんでした。ここ は私のコードスクリプトです： これは、HTML：

<div class="master-slider ms-skin-contrast" id="masterslider" > 
     {% for project in projects %} 
      <div class="ms-slide"> 
       <img src="{{asset('uploads/images/')}}{{project.images[0].name}}" data-src="{{asset('uploads/images/')}}{{project.images[0].name}}" alt="{{project.name}}"/> 
       <div class="ms-layer ms-caption" id="image-caption"> 
        {{project.name}} 
       </div> 

      </div> 
     {% endfor %} 
    </div> 

これはCSS

#image-caption{ 
    position: fixed; /* Stay in place */ 
    z-index: 9999; /* Stay on top */ 
    top: 250px; 
    right: 800px; 
    color: red; 
} 

Answer 1

OKです。今私はそれがどのように機能するか考えています。これはあなたの完全なCSSとLOT容易になるだろうが、あなたはただ何が起こるかを確認するには、このような何かを試すことがあります。

#image-caption { 
    position: absolute; 
    bottom: -50px; 
}