2つのdivsをワードプレスのテーマに並べて表示しようとしています。センタリングされずにコンテンツに準拠していないサイドバイサイドです。

Question

スライダーが一方の側（左側）にあり、3つの画像が別の側のバナーになる（右側）。

私が遭遇する問題は、（1）divが中心にならず、（2）より大きなモニタではdivがコンテンツに適合しないことです。私はそれを記述するための最善の方法は、応答性を保ちながらコンテンツと崩壊しないことだと思います。だからdivの幅をパーセンテージとして返すとdivがcollaspeにならないようにしますが、divの幅をautoにすると内容に適合します。

これは私のサイトhttp://jesuspeople.personalityweb.com/ですので、私は何を言っているのか分かります。 は、ここでは、このウルコンテンツを支援する以下のようなuは、そのグリッド構造に従わなければならないので、

.mydiv{ 
position: relative; 
display:inline-block; 
/*position: absolute;*/ 
width: 100%; 
margin-left: auto; 
margin-right: auto; 
height: auto !important; 
/*height: 650px !important;*/ 
/*border: thin solid red;*/ 
background-image: url("http://jesuspeople.personalityweb.com/ 
wp-content/uploads/2016/10/gradient-new-2.jpg"); 
background-repeat:repeat-x; 
overflow: hidden; 
/* z-index:-1;*/ 

} 

は、ここでは、非常に古いブートストラップを使用し

<div class='mydiv'>"; 
echo "<div style='float:left; width: 75%'>"; 
echo page_slider(); 
echo"</div><div style='float:right; width: 25%'> 
<img src='http://jesuspeople.personalityweb.com/wpcontent/uploads/2016 
/10/partner-with-us-1.jpg' /> 
<img src='http://jesuspeople.personalityweb.com/wp-content/ 
uploads/2016/10/prophetic-corner-1.jpg' /> 
<img src='http://jesuspeople.personalityweb.com/wp- 
content/uploads/2016/10/miracle-testimonies-1.jpg' /> 
</div>"; 
echo"</div>"; 

Answer 1

のdivのためのページ上の私のコードです私のdivのための私のCSSです整列

<div class='container'>"; 

echo "<div class='row'; 
echo "<div class='span8'; 
echo page_slider(); 
echo"</div><div class='span8'> 

<img src='http://jesuspeople.personalityweb.com/wpcontent/uploads/2016 
/10/partner-with-us-1.jpg' /> 
<img src='http://jesuspeople.personalityweb.com/wp-content/ 
uploads/2016/10/prophetic-corner-1.jpg' /> 
<img src='http://jesuspeople.personalityweb.com/wp- 
content/uploads/2016/10/miracle-testimonies-1.jpg' /></div>"; 

echo"</div></div>";