X   Сообщение сайта
(Сообщение закроется через 3 секунды)



 

Здравствуйте, гость (

| Вход | Регистрация )

Открыть тему
Тема закрыта
> Проблема с расположением в галерее !
Leha_1985
Leha_1985
Topic Starter сообщение 7.3.2012, 23:47; Ответить: Leha_1985
Сообщение #1


Проблема с расположением в галерее !
суть проблемы: правая часть галереи, там где отображается большая картинка
смешается вниз (на скриншоте показал), корректно работает только в Opera, в Chrome и Explorer происходит смещение вниз !
<body>
<!-- ЛЕВАЯ КОЛОНКА -->
<div id="lh-col">
<div id="menu1">
<ul>

<li><a href="brasleti.html">Мои работы</a></li>
<li><a href="sergi.html">Обо мне</a></li>
<li><a href="kolehki.html">Цены</a></li>
<li><a href="kontakti.html">Контакты</a></li>
</ul>
</div>
</div>
<!-- КОНЕЦ ЛЕВОЙ КОЛОНКИ -->
<div id="page">
<div id="container">
<h1>Alexandra_Potfolio</h1>

<ul id="menu">


<li>
<a href="tipresh.html">Мои работы</a>
<ul>
<li><a href="tipkvartira.html">Свадьба</a></li>
<li><a href="tipdom.html">Люди</a></li>
<li><a href="tipgaraz.html">Природа</a></li>
<li><a href="tipdacha.html">Город</a></li>
</ul>
</li>
<li><a href="articles.html">Обо мне</a></li>
<li>
<a href="#">Цены</a>
</li>

<li><a href="contacts.html">Контакты</a></li>
</ul>
<!-- Start Advanced Gallery Html Containers -->
<div id="gallery" class="content">
<div id="controls" class="controls"></div>
<div class="slideshow-container">
<div id="loading" class="loader"></div>
<div id="slideshow" class="slideshow"></div>
<div id="caption" class="caption-container"></div>
</div>

</div>
<div id="thumbs" class="navigation">
<ul class="thumbs noscript">
<li>
<a class="thumb" name="leaf" href="Svadba_big/IMG_0704-Edit.jpg" title="Title #0">
<img src="Svadba_s/IMG_0704-Edit.jpg" alt="Title #0" />
</a>
</li>

<li>
<a class="thumb" name="drop" href="Svadba_big/IMG_0762-Edit.jpg" title="Title #1">
<img src="Svadba_s/IMG_0762-Edit.jpg" alt="Title #1" />
</a>

</li>

<li>
<a class="thumb" name="bigleaf" href="Svadba_big/IMG_0763-Edit-2.jpg" title="Title #2">
<img src="Svadba_s/IMG_0763-Edit-2.jpg" alt="Title #2" />
</a>

</li>

<li>
<a class="thumb" name="lizard" href="Svadba_big/IMG_0765-Edit.jpg" title="Title #3">
<img src="Svadba_s/IMG_0765-Edit.jpg" alt="Title #3" />
</a>

</li>

<li>
<a class="thumb" href="Svadba_big/IMG_0766-Edit.jpg" title="Title #4">
<img src="Svadba_s/IMG_0766-Edit.jpg" alt="Title #4" />
</a>

</li>

<li>
<a class="thumb" href="Svadba_big/IMG_0779-Edit-2.jpg" title="Title #5">
<img src="Svadba_s/IMG_0779-Edit-2.jpg" alt="Title #5" />
</a>

</li>

<li>
<a class="thumb" href="Svadba_big/IMG_0782-Edit.jpg" title="Title #6">
<img src="Svadba_s/IMG_0782-Edit.jpg" alt="Title #6" />
</a>

</li>

<li>
<a class="thumb" href="Svadba_big/IMG_0826-Edit.jpg" title="Title #7">
<img src="Svadba_s/IMG_0826-Edit.jpg" alt="Title #7" />
</a>

</li>

<li>
<a class="thumb" href="Svadba_big/IMG_0830-Edit.jpg" title="Title #8">
<img src="Svadba_s/IMG_0830-Edit.jpg" alt="Title #8" />
</a>

</li>

<li>
<a class="thumb" href="Svadba_big/IMG_1106-Edit.jpg" title="Title #9">
<img src="Svadba_s/IMG_1106-Edit.jpg" alt="Title #9" />
</a>

</li>

<li>
<a class="thumb" href="Svadba_big/IMG_1279-Edit.jpg" title="Title #10">
<img src="Svadba_s/IMG_1279-Edit.jpg" alt="Title #10" />
</a>

</li>

<li>
<a class="thumb" href="Svadba_big/IMG_1280-Edit.jpg" title="Title #11">
<img src="Svadba_s/IMG_1280-Edit.jpg" alt="Title #11" />
</a>

</li>

<li>
<a class="thumb" href="Svadba_big/IMG_1287-Edit.jpg" title="Title #12">
<img src="Svadba_s/IMG_1287-Edit.jpg" alt="Title #12" />
</a>

</li>

<li>
<a class="thumb" href="Svadba_big/IMG_1321-Edit.jpg" title="Title #13">
<img src="Svadba_s/IMG_1321-Edit.jpg" alt="Title #13" />
</a>

</li>

<li>
<a class="thumb" href="Svadba_big/IMG_1414-Edit.jpg" title="Title #14">
<img src="Svadba_s/IMG_1414-Edit.jpg" alt="Title #14" />
</a>

</li>

<li>
<a class="thumb" href="Svadba_big/IMG_1553-Edit.jpg" title="Title #15">
<img src="Svadba_s/IMG_1553-Edit.jpg" alt="Title #15" />
</a>

</li>
</ul>
</div>
<!-- End Advanced Gallery Html Containers -->



[CSS]html, body {
margin:0;
padding:0;
}
body{
text-align: center;
font-family: "Lucida Grande", "Lucida Sans Unicode", Verdana, Helvetica, Arial, sans-serif;
background-image:url(../bg_color.png);
background-repeat:repeat;

font-size: 75%;
}
a{
color: #27D;
text-decoration: none;
}
a:focus, a:hover, a:active {
text-decoration: underline;
}
p, li {
line-height: 1.8em;
}
h1, h2 {
font-family: "Times New Roman", Times, serif ;
margin: 0 0 10px 0;
letter-spacing:-1px;
}
h1 { width:300px;
padding: 0;
font-size: 2em;
color: #093;
float:left;
}
h2 {
padding-top: 10px;
font-size:2em;
}
pre {
font-size: 1.2em;
line-height: 1.2em;
overflow-x: auto;
}
div#page {
width: 1115px;
background-color: #E7E6DE;
margin: 0 auto;
text-align: left;
border-color: #ddd;
border-style: none solid solid;
border-width: medium 1px 1px;
}
div#container {
padding:0px 10px 20px 5px;
background-color:#CCC;
height: 100%;
}

div#footer {
clear: both;
color: #777;
margin: 0 auto;
padding: 20px 0 40px;
text-align: center;
}
/* Menu */

#menu {
float: right ;
padding-top:0px;
width: 690px;
height: 37px;
margin: 0;
padding: 0 0 0 6px;
list-style: none;

}

#menu li {
list-style: none;
float: left;
height: 25px;
padding: 0;
margin: 0;
width: 114px;
text-align: center;
background: #1F1F1F;
position: relative;
padding-top: 12px;
}
#menu li ul {
list-style: none;
padding: 0;
margin: 0;
width: 114px;
display: none;
position: absolute;
left: 0;
top: 37px;
}
#menu li ul li {
;
float: none;
height: 25px;
margin: 0;
width: 114px;
text-align: center;
background: #7F7F7F;
}
#menu li a { font-family:Verdana, Geneva, sans-serif;
display: block;
width: 114px;
height: 25px;
color: #fff;
text-decoration: none;
position: inherit ;
}
#menu li:hover ul, #menu li.jshover ul {
display: block;
}
#menu li:hover, #menu li.jshover {
background: #424242;
}

/* Левая КОЛОНКА */
#lh-col{ border:0px solid; color: #CCC ;
border-radius:6px;
-webkit-border-radius:6px;
-moz-border-radius:5px;
-khtml-border-radius:10px;
position:absolute;
margin-top:0px;

width:190px;
float: left;
padding: 0px;
height: 360px;
margin-left:20px;

}

/* МЕНЮ */
#menu1{ margin:0px;
padding: 5px 5px 5px 5px; }

#menu1 ul { list-style:none;

margin:0;

padding: 0;
width: 180px;
height: 330px;}

#menu1 li { text-decoration: underline;
text-align:left;
font-family: Georgia, "Times New Roman", Times, serif;
font-style:italic;
font-size:16px;
margin: 0;


}

#menu1 a {
color: #FFF;
display: block;
margin: 0;
padding: 8px 12px;
text-decoration: none;

}
#menu1 a:hover {
color: #F90;
padding-bottom: 8px;
}[/CSS]

[CSS]div.content {
/* The display of content is enabled using jQuery so that the slideshow content won't display unless javascript is enabled. */
display: none;
float: right;
width: 800px;
font-family:Verdana, Geneva, sans-serif;

}
div.content a, div.navigation a {
text-decoration: none;
color: #777;
}
div.content a:focus, div.content a:hover, div.content a:active {
text-decoration: underline;
}
div.controls {
margin-top: 22px;
height: 23px;
}
div.controls a {
padding: 5px;
}
div.ss-controls {
float: left;
}
div.nav-controls {
float: right;
}
div.slideshow-container {
margin:0px;
position: relative;
clear: both;
height: 610px; /* This should be set to be at least the height of the largest image in the slideshow */
}
div.loader {
position: absolute;
top: 0;
left: 0;
background-image: url('loader.gif');
background-repeat: no-repeat;
background-position: center;
width: 700px;
height: 502px; /* This should be set to be at least the height of the largest image in the slideshow */
}
div.slideshow {

}
div.slideshow span.image-wrapper {
display: block;
position: absolute;
top: 0;
left: 0;
}
div.slideshow a.advance-link {
display: block;
width: 700px;
height: 502px; /* This should be set to be at least the height of the largest image in the slideshow */
line-height: 502px; /* This should be set to be at least the height of the largest image in the slideshow */
text-align: center;
}
div.slideshow a.advance-link:hover, div.slideshow a.advance-link:active, div.slideshow a.advance-link:visited {
text-decoration: none;
}
div.slideshow img {
padding-top:2px;
vertical-align: middle;
border: 1px solid #ccc;
}

div.caption-container {

}
span.image-caption {
display: block;
position: absolute;
}


div.image-desc {
line-height: 1.3em;
padding-top: 12px;
}
div.navigation {font-family:Verdana, Geneva, sans-serif;
padding-top: 17px;
/* The navigation style is set using jQuery so that the javascript specific styles won't be applied unless javascript is enabled. */
}
ul.thumbs { width:290px;
clear: both;
margin: 0;
padding: 0;
}
ul.thumbs li {
float: left;
padding: 0;
margin: 5px 5px 5px 0;
list-style: none;
}
a.thumb {
padding: 2px;
display: block;
border: 1px solid #ccc;
}
ul.thumbs li.selected a.thumb {
background: #000;
}
a.thumb:focus {
outline: none;
}
ul.thumbs img {
border: none;
display: block;
}
div.pagination {
clear: both;
}
div.navigation div.top {
margin-bottom: 12px;
height: 11px;
}
div.navigation div.bottom {
margin-top: 12px;
}
div.pagination a, div.pagination span.current, div.pagination span.ellipsis {
display: block;
float: left;
margin-right: 2px;
padding: 4px 7px 2px 7px;
border: 1px solid #ccc;
}
div.pagination a:hover {
background-color: #eee;
text-decoration: none;
}
div.pagination span.current {
font-weight: bold;
background-color: #000;
border-color: #000;
color: #fff;
}
div.pagination span.ellipsis {
border: none;
padding: 5px 0 3px 2px;
}

[/CSS]
0
Вернуться в начало страницы
 
Ответить с цитированием данного сообщения
Оксана Мязина
Оксана Мязина
сообщение 8.3.2012, 0:41; Ответить: Оксана Мязина
Сообщение #2


сложно найти ошибку так, может ссылочку дадите? возможно это причина [CSS]div.slideshow-container { clear: both; }[/CSS]
Вернуться в начало страницы
 
Ответить с цитированием данного сообщения
Leha_1985
Leha_1985
Topic Starter сообщение 8.3.2012, 1:04; Ответить: Leha_1985
Сообщение #3


napilnik,
еще некуда ссылку давать!
вот архивчик! http://fileshare.in.ua/5941177
брал эту галерею http://www.twospy.com/galleriffic/example-2.html
только изменял под себя размеры!
Вернуться в начало страницы
 
Ответить с цитированием данного сообщения
Оксана Мязина
Оксана Мязина
сообщение 8.3.2012, 1:16; Ответить: Оксана Мязина
Сообщение #4


у div.slideshow a.advance-link убрать line-height: 502px;

и чтоб было красивее у div#container убрать height: 100%;
Вернуться в начало страницы
 
Ответить с цитированием данного сообщения
Leha_1985
Leha_1985
Topic Starter сообщение 8.3.2012, 1:43; Ответить: Leha_1985
Сообщение #5


napilnik,
спасибо большое ! помогло !

Замечание модератора:
Эта тема была закрыта автоматически ввиду отсутствия активности в ней на протяжении 100+ дней.
Если Вы считаете ее актуальной и хотите оставить сообщение, то воспользуйтесь кнопкой
или обратитесь к любому из модераторов.
Вернуться в начало страницы
 
Ответить с цитированием данного сообщения
Открыть тему
Тема закрыта
2 чел. читают эту тему (гостей: 2, скрытых пользователей: 0)
Пользователей: 0


Свернуть

> Похожие темы

  Тема Ответов Автор Просмотров Последний ответ
Открытая тема (нет новых ответов) Проблема с админкой
5 Prok 2315 29.7.2019, 20:04
автор: dvakarandasha
Открытая тема (нет новых ответов) Тема имеет прикрепленные файлыПроблема с таблицей, которая выводится через скрипт
7 vanchester 1335 15.2.2019, 19:06
автор: Artos_mw
Открытая тема (нет новых ответов) Тема имеет прикрепленные файлыПроблема в тегах при сохранении контента
1 Kord18 1403 13.3.2018, 18:19
автор: Evgeniy3200
Открытая тема (нет новых ответов) Тема имеет прикрепленные файлыПроблема вёрстки адаптивной страницы на divах
28 master-vek 4712 8.2.2018, 19:29
автор: master-vek
Открытая тема (нет новых ответов) Проблема с All in one SEO?
17 okseo 2680 30.11.2017, 14:06
автор: okseo


 



RSS Текстовая версия Сейчас: 28.3.2024, 20:06
Дизайн