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



 

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

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

Открыть тему
Тема закрыта
> проблема с двумя блоками css
123456789igor
123456789igor
Topic Starter сообщение 27.8.2012, 21:04; Ответить: 123456789igor
Сообщение #1


[IMG]http://img13.imageshost.ru/img/2012/08/27/image_503bac3e8c919.jpg[/IMG]
есть вот такая страничка написанная на html javascript и css. Вопрос следующий Текст, который выделен в кружке на картинке, не получается вставить на один уровень с видео. Что-то с блоками в style.css но вот как решить проблему не пойму
часть кода из main.html:
<section id="content">
<div class="container_12">
<article class="a1 border-bot extra-wrap">
<center><iframe width="640" height="480" src="http://www.youtube.com/embed/0FgKQdc96k4" frameborder="0" allowfullscreen></iframe></center></br>
<article class="a1 border-bot2 extra-wrap">
<strong>Right Sidebar:</strong> Integer velit. Vestibulum nisi nunc, accumsan ut, vehicula sit amet, porta a, mi. Nam nisl tellus, placerat eget, posuere eget, egestas eget, dui. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. In elementum urna a eros. Integer iaculis. Maecenas vel elit.

</article>
</article>
</div>
</div>


И из css:
[CSS]
/********************** Content ************************/

section#content {
padding:55px 0px 65px 0;

}
#splash #content {
background:#090909;
position:absolute;
bottom:0;
top:137px;
z-index:1;
left:0;
right:0;
overflow:hidden;
padding:0;
}
#splash #advanced {
position:absolute !important;
}
.splash-min-height {
min-height:300px;
}

.col-1 {
float:left;
width:183px;
margin:0 35px 0 0;
}
.col-2 {
float:left;
width:183px;
}
.map-container {
margin:0 0 25px 0;
}
.map-container iframe {
width:270px;
height:338px;
margin:0;
border:none;
}
.adress {padding:0;}
.adress dt {
display:block;
font-weight:normal;
color:#fff;
font-size:14px;
line-height:26px;
padding:0 0 8px 0;
}
.adress dd {
font-size:14px;
line-height:26px;
color:#9b9a9a;
overflow:hidden;
}
.adress dd span {
float:left;
width:82px;
}

.content-box {
width:940px;
margin:0 auto;
padding:0;
}
.inner-404 {
background:url(../images/page404-img.jpg)/*tpa=http://static.livedemo00.template-help.com/wt_40504/images/page404-img.jpg*/ no-repeat 0 0;
padding:0 0 0 640px;
min-height:340px;
}
.heading-404 {
display:block;
color:#fff;
font-weight:normal;
font-family: 'Oswald', sans-serif;
font-size:48px;
line-height:55px;
}
strong.heading-404 {
}
b.heading-404 {
font-size:42px;
margin:-6px 0 22px 0;
}
.inner-404 p {
font-size:14px;
line-height:26px;
padding:0 0 10px 0;
color:#9b9a9a;
}
[/CSS]


ещё
[CSS]
.extra-wrap{
overflow:hidden;
display:block;
}
[/CSS]

[CSS].border-bot {
padding:0px 86% 30px 0;
/*padding-bottom:20px; */
margin-bottom:29px;
border-bottom:1px solid #1d1d1d;
}[/CSS]


[CSS].border-bot2 {
padding:0px 0px 0px 660px;
width:560px;
/*padding-bottom:20px; */
margin-bottom:129px;
border-bottom:1px solid #1d1d1d;
}[/CSS]

[CSS].a1 {margin:0 10px;}[/CSS]

[CSS].container_12{margin-left:auto;margin-right:auto;width:1000px;position:relative;}[/CSS]
0
Вернуться в начало страницы
 
Ответить с цитированием данного сообщения
omfg
omfg
сообщение 27.8.2012, 22:39; Ответить: omfg
Сообщение #2


Можно ссылку на страницу если это не denwer или полный html + css код
Вернуться в начало страницы
 
Ответить с цитированием данного сообщения
123456789igor
123456789igor
Topic Starter сообщение 28.8.2012, 2:07; Ответить: 123456789igor
Сообщение #3


[attachment=39106:index.html][attachment=39107:shadowbox-3.0.3.rar]
вот
Вернуться в начало страницы
 
Ответить с цитированием данного сообщения
kvmutl
kvmutl
сообщение 28.8.2012, 4:56; Ответить: kvmutl
Сообщение #4


а обтекание где?
для .border-bot и .border-bot2 свойство float:left установите
Вернуться в начало страницы
 
Ответить с цитированием данного сообщения
RiD_hb
RiD_hb
сообщение 28.8.2012, 10:07; Ответить: RiD_hb
Сообщение #5


ну у вас grid... по ней и стройте...
что то в таком духе...

<div class="container_12">
<div class="grid_8">
<iframe width="640" height="480" src="http://www.youtube.com/embed/0FgKQdc96k4" frameborder="0" allowfullscreen></iframe>
</div>
<div class="grid_4">
<p><strong>Right Sidebar:</strong> Integer velit. Vestibulum nisi nunc, accumsan ut, vehicula sit amet, porta a, mi. Nam nisl tellus, placerat eget, posuere eget, egestas eget, dui. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. In elementum urna a eros. Integer iaculis. Maecenas vel elit.</p>
</div>
</div>
Вернуться в начало страницы
 
Ответить с цитированием данного сообщения
123456789igor
123456789igor
Topic Starter сообщение 28.8.2012, 16:55; Ответить: 123456789igor
Сообщение #6


попробовал с grid но результат тот же что и с float:left для border-bot и border-bot2 все перекашивается
http://demo3285.atservers.net/
Вернуться в начало страницы
 
Ответить с цитированием данного сообщения
123456789igor
123456789igor
Topic Starter сообщение 28.8.2012, 17:04; Ответить: 123456789igor
Сообщение #7


а если делать так:
<article class="a1 border-bot extra-wrap">
<iframe width="640" height="480" src="http://www.youtube.com/embed/0FgKQdc96k4" frameborder="0" allowfullscreen></iframe>
Right Sidebar: Integer velit. Vestibulum ni
</article>

при
[CSS].border-bot {
/* float:left; */
padding:0px 86% 30px 0;
margin-bottom:29px;
border-bottom:1px solid #1d1d1d;[/CSS]
то видео и надпись располагаются просто друг под другом при float:left все сносит и перекашивает
Вернуться в начало страницы
 
Ответить с цитированием данного сообщения
123456789igor
123456789igor
Topic Starter сообщение 28.8.2012, 17:31; Ответить: 123456789igor
Сообщение #8


все проблема решена в большее степени спасибо RiD'у сделал что мне нудно через grid
Вернуться в начало страницы
 
Ответить с цитированием данного сообщения
omfg
omfg
сообщение 28.8.2012, 17:43; Ответить: omfg
Сообщение #9


фуф,ну и версточка на этом сайте,ничего не понятно сначала было,разобрался
может немного нерационально но работает,после <div class="container_12"> и до <!--- <div class="grid_8">
пропиши
<div class="main">
<div class="one">
<iframe width="640" height="480" src="http://www.youtube.com/embed/0FgKQdc96k4" frameborder="0" allowfullscreen></iframe>
</div>
<div class="two">
Right Sidebar: Integer velit. Vestibulum ni
</div>
</div>


В css добавь
[CSS].main { width: auto;height:500px;}
.one { margin-left:10px; width: 650px;float:left; }
.two { margin-left:10px; width: 250px;float:left; }[/CSS]

Вот результат
[IMG]http://fotohost.kz/images/2012/08/28/YGXt.png[/IMG]
Вернуться в начало страницы
 
Ответить с цитированием данного сообщения
RiD_hb
RiD_hb
сообщение 28.8.2012, 17:59; Ответить: RiD_hb
Сообщение #10


(omfg @ 28.8.2012, 20:43) *
фуф,ну и версточка на этом сайте,ничего не понятно сначала было

это не верстка, это CSS Фреймворк перелопаченоый...

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


Свернуть

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

  Тема Ответов Автор Просмотров Последний ответ
Открытая тема (нет новых ответов) Разработка/доработка сайтов Wordpress, HTML/CSS/JS
Вёрстка, перенос на WP, правки
9 malamut 3331 25.1.2024, 14:36
автор: malamut
Открытая тема (нет новых ответов) СОЗДАНИЕ : / САЙтЫ / ЛЕНДЫ / БОТЫ ТГ / ВАЙТЫ / КРЕО / СОФТЫ / ДИЗАЙН [PHP, JS, HTML/CSS] и другое
5 CULA 3291 19.12.2023, 18:55
автор: CULA
Открытая тема (нет новых ответов) Продам генератор постов для соц. сетей, работающий на контенте со сторонних сайтов, со встроенными своими рекламными блоками под выведение нужной рекламы
0 Tutich 2492 19.8.2021, 9:47
автор: Tutich
Открытая тема (нет новых ответов) Веб-разработка (HTML, CSS)
1 ViktoriaFE 6438 5.5.2021, 5:22
автор: bekett
Открытая тема (нет новых ответов) Разработка адаптивных вебсайтов. HTML/CSS/WordPress(сайты-визитки, лендинги, корпоративные сайты, интернет-магазины).
0 kozak199110 1652 3.3.2021, 12:22
автор: kozak199110


 



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