2014-10-26 6 views
-2

Следующий HTML-код работает нормально, но я не могу прокручивать страницу, появляющаяся полоса прокрутки не активна. Для разделения страницы требуется фиксированная позиция, поэтому, пожалуйста, помогите мне разобраться с проблемой.строка прокрутки с фиксированной позицией

<html lang="en"> 
<head> 
<head> 
    <meta name="viewport" content="width=device-width, initial-scale=1"> 
    <link rel="stylesheet" href="http://maxcdn.bootstrapcdn.com/bootstrap/3.2.0/css/bootstrap.min.css"> 
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no"> 
    <style> 

body 
{ 
margin: 0%; 
padding: 0%; 
} 
.container 
{ 


    width: 100%; 
    height: 100%; 
    } 
#left 
{ 
float: left; 
position: fixed; 
    top: 0%; 
    left: 0%; 
    width: 50%; 
    height: 100%; 


} 
#right 
{ 
position: fixed; 

    top: 0%; 
    right: 0%; 
    width: 50%; 
    height: 100%; 
    background-color: #59595c; 


} 

#centrd { 

    padding-top: 40%; 


} 
#centd { 

    padding-top: 40%; 


}  

.pos_fixed { 
    position: fixed; 
    top: 3.5%; 
    right: 2.5%; 
    display: inline-block; 
} 




</style> 

</head> 



    <body> 

<div class="container"> 
<div class="row" > 
<div class="col-md-6" style="padding-top:500px;"> 
<div id="left" align="center"> 
<div id="centd"> 
     <img src="http://localhost/wordpress/wp-content/uploads/2014/10/ramc-Untitled-1.png" alt="Smiley face" width="150" height="150"> 
     </div> 


<a href="http://localhost/wordpress/album-categories/wedding/"><img src="http://localhost/wordpress/wp-content/uploads/2014/10/Studio-A-travel1.png" alt="list item 1" width="150"/></a> 
<a href="http://localhost/wordpress/album-categories/wedding/"><img src="http://localhost/wordpress/wp-content/uploads/2014/10/Knowledge-icon2.png" alt="list item 2" width="150" /></a> 

</div> 
</div> 









<div class="col-md-6" style="padding-top:500px;"> 
<div id="right" align="center"> 
     <div id="centrd"> 
     <img src="http://localhost/wordpress/wp-content/uploads/2014/10/studioa-a1.png" alt="Smiley face" width="150" height="150"> 
     </div> 
     <a href="http://localhost/wordpress/album-categories/wedding/"><IMG src="http://localhost/wordpress/wp-content/uploads/2014/10/Studio-A-WED.png" alt="list item 1" width="150" /></a> 
     <a href="http://localhost/wordpress/album-categories/wedding/"><IMG src="http://localhost/wordpress/wp-content/uploads/2014/10/Studio-A-Cam.png" alt="list item 2" width="150" /></a> 


</div> 
</div> 

<div class="pos_fixed"> 
     <a href="http://www.amarramesh.com/contact/"><img src="http://localhost/wordpress/wp-content/uploads/2014/10/get-in-touch.png" alt="Smiley face" width="100" height="100"> 
     </div> 
</div> 


</div> 
</div> 





</body> 
+0

Вы также можете показать свой html-код? –

+0

Что означает #right и #left? –

+0

Где вы дали название стиля css? #left #right представляет что? –

ответ

0

{позиция: фиксированная;} не будет прокручиваться: вы блокируете объект (предположительно дел) к определенной части окна. Он останется там.

+0

, если я удаляю позицию: исправлено, тогда объекты находятся в случайном положении. пожалуйста помогите. –

+0

Вот я. Вопрос. У меня есть страница на моем веб-сервере: вам нужно, чтобы страница была разделена на две части и ... обе части должны прокручиваться по вертикали? – sachax

Смежные вопросы