2011-06-19 2 views
0

Я пытаюсь получить свой DIV для отображения только горизонтальная полоса прокрутки. Я заполняю DIV множеством изображений и хочу, чтобы пользователь мог прокручивать по горизонтали.DIV, не отображающий горизонтальную полосу прокрутки

Но у меня есть две проблемы:

Один учебник я прочитал дал мне некоторый код (который я больше не имею), что говорит, что будет отображать полосу прокрутки. Но это не так. И это также заставило изображения появляться ниже друг друга. Поэтому я отказался от этого кода.

Еще один учебник дал мне «вид», который я хотел, , но без полос прокрутки. Но появлялись полосы прокрутки!

Как я могу получить DIV, полный фото и горизонтальную полосу прокрутки?

Вот что я до сих пор:

CSS: (dude.css)

.EditorialImagePaneOne 
{ 
    width: 500px 

    -ms-overflow-x:scroll; 
     overflow-x:scroll; 
    white-space:nowrap; 

} 

.ShowcaseImage 
{ 
    height: 407px; 
} 

HTML: (Index.html)

<!DOCTYPE html> 
<html lang="en"> 
    <head> 
     <meta charset="utf-8" /> 
    <link rel="stylesheet" href="../Assets/CSS/dude.css" /> 
     <title></title> 
    </head> 
    <body> 

    <div class="EditorialImagePaneOne"> 
     <img src="../Assets/Images/Editorial/1-1.jpg" class="ShowcaseImage" /> 
     <img src="../Assets/Images/Editorial/1-2.jpg" class="ShowcaseImage" /> 
     <img src="../Assets/Images/Editorial/1-3.jpg" class="ShowcaseImage" /> 
     <img src="../Assets/Images/Editorial/1-4.jpg" class="ShowcaseImage" /> 
     <img src="../Assets/Images/Editorial/1-5.jpg" class="ShowcaseImage" /> 
     <img src="../Assets/Images/Editorial/1-6.jpg" class="ShowcaseImage" /> 
     <img src="../Assets/Images/Editorial/1-7.jpg" class="ShowcaseImage" /> 
     <img src="../Assets/Images/Editorial/1-8.jpg" class="ShowcaseImage" /> 
    </div> 
    </body> 
</html> 
+1

Вам не хватает точки с запятой в вашем CSS. Это опечатка или копия вашего кода? –

+1

Код, который вы опубликовали, работает [просто отлично] (http://jsfiddle.net/us4rA/) на Chrome 13, IE 9 и FF 3.6, поэтому, пожалуйста, объясните, что именно не так. –

+0

@Henrik - Извините, просто опечатка с копией. Он имеет точку с запятой в фактическом файле кода. – bendr

ответ

1

Может быть, вы пропустите что-то вроде DOCTYPE на странице .. убедитесь, что это как первая строка в вашем коде, выше линии <html>:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd"> 
+0

Хмм. В настоящее время я использую: '', поскольку это веб-сайт на основе HTML5. Но я отдам его, чтобы посмотреть. – bendr

+1

Так что это должно сработать - вы случайно взглянете на HTML, дважды щелкнув по нему? Это нехорошо, вы должны просмотреть его как веб-страницу, размещенную на каком-то сервере. –

+0

Спасибо за бит Doctype. Я просто попробовал, но это не имело никакого значения. Эта полоса прокрутки все еще не появляется. – bendr

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