位置一列到頁面的右側

我只需要在我的索引頁上有一列，我希望它在屏幕的右側。我正在使用具有我想要的左側背景圖像。 bg-image是在body位置一列到頁面的右側

我正在嘗試這種方法，但它並沒有獲得一切的權利。我是否正在討論這個錯誤，更一般地說，你如何將一列放在屏幕的右側？

CSS的四個內的div

body{ 
background-image: url(images/splashpage.jpg); 
background-position:top; 
font-family: Arial, Helvetica, sans-serif; 


    } 
.one{ 
<!-- width:40%; --> 
background-color:lightblue; 
font-family: Arial, Helvetica, sans-serif; 
position:relative; 

<!-- left:150px; --> 

} 
.two{ 
width:580px; 
background-color:lightgreen; 
position:relative; 
right:100px; 
top:50px; 
} 
.three{ 
width:600px; 
background-color:blue; 
position:relative; 
right:100px; 

} 
.four{ 
width:580px; 
position:relative; 
left:20px; 
margin: 0 auto; 
top:50px; 

} 
.footer{ 
width:580px; 
text-align:center; 
position:relative; 
top:50px;

來源

2014-02-15 rogerthat

這就是你的所有CSS和HTML？ –

不，只是顯示我在做的方式 – rogerthat

你可以添加你的代碼來搗鼓... – Krish

這是工作的罰款爲包含div浮動權，但所有這一切所做的是通過側把內div的側面，我需要他們疊加。

<div style=" float:right" class="container" > 
    <div class="one" style="float:right"></div> 
    <div class="two" style="float:right"></div> 
    <div class="three" style="float:right"></div> 
    <div class="four" style="float:right"></div> 
</div>

所以我把每個之間的明確div，現在的容器div浮動右邊以及內部divs堆疊時。現在看起來很簡單，但也許如果別人有這個問題，這將有助於。

<div style=" float:right" class="container" > 
    <div class="one" style="float:right"></div> 
    <div style="clear:both"></div> 
    <div class="two" style="float:right"></div> 
    <div style="clear:both"></div> 
    <div class="three" style="float:right"></div> 
    <div style="clear:both"></div> 
    <div class="four" style="float:right"></div> 
</div>

不知道，如果它的最佳實踐，或者如果有一個更有效的方式，但它的工作原理。

來源

2014-02-15 09:12:42 rogerthat

位置一列到頁面的右側

回答

相關問題