VPF::как размножить эллемент по x в div

supervladislav

Дата 19.10.2008, 16:24 (ссылка)

(нет голосов)

Загрузка ...

///\\\///\\\///\\\

Профиль
Группа: Завсегдатай
Сообщений: 1771
Регистрация: 18.5.2006

Репутация: нет
Всего: -9

мне нужно чтобы полоска растягивалась по x как это сделать ,теста или другого слоя внутри дива небудет

Код


div#verh{background-color:#000000;background-image:url(../screen/polosa.png);background-repeat:repeat-x;width:6px;height:64px;background-position:top;  }

webster

Дата 19.10.2008, 17:10 (ссылка)

(нет голосов)

Загрузка ...

Опытный

Профиль
Группа: Участник
Сообщений: 361
Регистрация: 1.1.2007

Репутация: 34
Всего: 34

Чтобы полоска растягивалась, нужно использовать дополнительный элемент <img />, которому можно задать параметры ширины в %:

Код


div#verh img {
width: 100%;
height: 64px;
display: block;
font-size: 1px;
line-height: 0px;/*Это на случай, если размер элемента будет меньше высоты буквы текста, содержащегося в нем, или overflow: hidden;*/
}

Код


<div id="verh">
     <img src="screen/polosa.png" />
</div>

Бэкгроунд же растянуть не получится, только повторить по той или иной оси (или по обеим).

Это сообщение отредактировал(а) webster - 19.10.2008, 17:19

supervladislav

Дата 19.10.2008, 17:32 (ссылка)

(нет голосов)

Загрузка ...

///\\\///\\\///\\\

Профиль
Группа: Завсегдатай
Сообщений: 1771
Регистрация: 18.5.2006

Репутация: нет
Всего: -9

незнаю насколько я правильно сделал но я припоял id к таблице вот так

Код


#verh{background-color:#000000;background-image:url(../screen/polosa.png);background-repeat:repeat-x;width:6px;height:64px;background-position:top;  }
#niz{background-color:#000000;background-image:url(../screen/nizpolosa.png);background-repeat:repeat-x;width:4px;height:60px;text-align:center;}

вот только я хотел бы теперь ,чтобы внутри таблицы была надпись как её там разместить

Код


<tr align=center>
<td colspan="2" id=niz><div style="margin-right:50%;margin-left:50%;"> <nobr>Copirighr by Svetlana Belaeva 2008 &copy;</nobr></div></td>
</tr>
</table>

webster

Дата 19.10.2008, 18:50 (ссылка)

(нет голосов)

Загрузка ...

Опытный

Профиль
Группа: Участник
Сообщений: 361
Регистрация: 1.1.2007

Репутация: 34
Всего: 34

Цитата из первого поста:

Цитата(supervladislav @ 19.10.2008, 16:24

)

мне нужно чтобы полоска растягивалась по x как это сделать ,теста или другого слоя внутри дива небудет

цитата из второго поста:

Цитата(supervladislav @ 19.10.2008, 17:32

)

вот только я хотел бы теперь ,чтобы внутри таблицы была надпись как её там разместить

теперь у меня появился вопрос: так в чем же был вопрос?

Если вы делаете заливку бэкгроундом с повторением по всему элементу, то никакого отношения он (бэкгроунд) к содержимому элемента не имеет, это просто фон-заставка, он не оказывает влияния ни на что, кроме как на раскрашивания области элемента и никакие дивы внутри ячейки таблицы не нужны, текст в ячейке выравнивается обычными свойствами CSS:

Код


td {
vertical-align: middle;
text-align: center;
white-space: nowrap;
}

supervladislav

Дата 19.10.2008, 21:42 (ссылка)

(нет голосов)

Загрузка ...

///\\\///\\\///\\\

Профиль
Группа: Завсегдатай
Сообщений: 1771
Регистрация: 18.5.2006

Репутация: нет
Всего: -9

Замучался в середине,все заголовки почему-то слева а не по центру, по центру становится ничего не хочет,ну естевственно только в эксплорере,
webster white-space:nowrap помог ,но для всей ячейки твой код неработает.

Код


<td  id="cen" width="80%"  align=center><br><hr width="95%" size="1" color=red>
<h1 style="text-align:center;font-size:16px;white-space:nowrap;">ДОБРО пожаловать на сайт парапсихолога - Беляевой Светланы Вячеславовны "МАГИЧЕСКАЯ ЭНЕРГИЯ" 
       </h1>
        <hr width="95%" size="1" color=red>


<h2 style="text-align:center;white-space:nowrap;">Магические услуги</h2>
        <ul type="disc" class="text4">        
 
         <li>      <strong> Предсказания</strong> на древнеегипетских <strong>картах Таро</strong>:
                   прошлое, настоящее,  будущее, по дням, на год, на  10 лет,<br> 
                    на дни, связанные с важными событиями, любые вопросы
                     бизнеса,  личной жизни, здоровья, а также важная информация
                  по картам Таро<br>  о ваших близких и знакомых.
                 

 </li>

 <li> <strong> Гадание(чтение) по руке.</strong></li>

<li> Программа судьбы по дате вашего рождения,важные даты
  вашей жизни.Нумерология- <strong>магия</strong> чисел</li>
<li><strong>Магия денег-привлечение денежной энергии.</strong></li>
    <li> Диагностика и снятие любых чужеродных программ,как <strong>сглаз</strong>,<strong>порча</strong>,
  <strong>родовое проклятье</strong>,<strong>приворот</strong>(можно по фото).</li>

  <li><strong>Снятие алкогольной зависимости</strong> в любой стадии(можно по фото).</li>

  <li>Психоанализ любых сложных ситуаций и проблем,решение их.</li>

  <li><strong>Талисманы</strong>:на деньги, любовь, здоровье, поиск кладов, удачу, карьеру.</li>

  <li>Поиск людей, машин и тд. по фото.</li>
<li>Сильная <strong>любовная магия</strong> для вас</li>
 <li> <strong>Сильные любовные привороты </strong>на месяц, на год, на всю жизнь.</li>
 
   <li>А так-же любая <strong>помощь мага </strong>для вас</li>
</ul>
<span class="text">Стоимость всех <strong>магических услуг</strong> обговаривается индивидуально!</span>
<br><a href="promote.html" style="color:red;font-size:14px;text-decoration:none;">раскрутка сайта бесплатно!!!</a></td>
</tr>
<tr>
<td colspan="2" id=niz><br> <nobr><div style="margin-left:400px;margin-right:400px;">Copirighr by Svetlana Belaeva 2008 &copy;</div></nobr></td>
</tr>
</table>

Код


#cen{background-color:#000000;background-image:url(../screen/polosasered.jpg);background-repeat:repeat-x;width:5px;height:500px;vertical-align: middle;
text-align: center;
white-space: nowrap;}
.text4{font-size:14px;text-align:left;text-indent:10px;font-family:"Times New Roman", Times, serif;color:#FFFFFF;white-space:nowrap;width:900px;padding:10px 10px 10px 10px;margin:10px 10px 10px 10px;}

.text8{font-family:Verdana, Arial, Helvetica, sans-serif;text-indent:8px;margin:10px 10px 80px 80px;font-size:13px;text-align:left;}
.text{font-size:16px;text-align:center;text-indent:10px;font-family:"Times New Roman", Times, serif;
line-height:1.5;white-space:nowrap;}

Это сообщение отредактировал(а) supervladislav - 19.10.2008, 21:43

Ctulhy

Дата 19.10.2008, 23:24 (ссылка)

(нет голосов)

Загрузка ...

Шустрый

Профиль
Группа: Участник
Сообщений: 137
Регистрация: 2.8.2008
Где: Россия, Курск

Репутация: 2
Всего: 2

Не, ну может я туговат и не пойму че нада, но прописать li#title {text-align:center} и подставить у нужных тегов соответствующий атрибут в наше суровое время уже не катит? У меня работает, да и причин не работать я не вижу.

--------------------

скучно в Москве и дождливо в Крыму.

supervladislav

Дата 20.10.2008, 12:15 (ссылка)

(нет голосов)

Загрузка ...

///\\\///\\\///\\\

Профиль
Группа: Завсегдатай
Сообщений: 1771
Регистрация: 18.5.2006

Репутация: нет
Всего: -9

простите ,что неясно выразился ,заголовки сезжают влево почему-то ,может лучше использовать див внутри

Ctulhy

Дата 20.10.2008, 12:46 (ссылка)

(нет голосов)

Загрузка ...

Шустрый

Профиль
Группа: Участник
Сообщений: 137
Регистрация: 2.8.2008
Где: Россия, Курск

Репутация: 2
Всего: 2

Разберись с размерами #cen {width:5px;height:500px;}
Если убрать - центирование работает. А то в блоке шириной 5 пиксилей центироваться заголовку как-то особо не где.

--------------------

скучно в Москве и дождливо в Крыму.

supervladislav

Дата 20.10.2008, 17:05 (ссылка)

(нет голосов)

Загрузка ...

///\\\///\\\///\\\

Профиль
Группа: Завсегдатай
Сообщений: 1771
Регистрация: 18.5.2006

Репутация: нет
Всего: -9

неа неработает чего-то центрирование во всех ячейках убрал,пробовал убрать и из заголовках - тоже самое .
разобрался с размером,там было 10 а не 5 ,может позиционированием попробовать?

Это сообщение отредактировал(а) supervladislav - 20.10.2008, 17:15

supervladislav

Дата 20.10.2008, 17:23 (ссылка)

(нет голосов)

Загрузка ...

///\\\///\\\///\\\

Профиль
Группа: Завсегдатай
Сообщений: 1771
Регистрация: 18.5.2006

Репутация: нет
Всего: -9

а как вобще правильно растянуть эллемент при табличной вёрстке ????

Ctulhy

Дата 20.10.2008, 17:39 (ссылка)

(нет голосов)

Загрузка ...

Шустрый

Профиль
Группа: Участник
Сообщений: 137
Регистрация: 2.8.2008
Где: Россия, Курск

Репутация: 2
Всего: 2

Без указания размеров работает, я же говорил. Абслютно позиционируй текст, должно помочь.
вообщем я бы сдеалл так. В ячейке таблицы пишем следущий код:

Код


<div class="background"></div>
<div class="all_text">
       <h1 style="text-align:center;">text</h1>

       <ul>
       <li>...other...</li>
       </ul>
</div>

Код


.background {background-image:url(1.jpg); background-repeat:repeat-x; background-position:/*значение, если нужно*/; width:100px; height:100px;} /*для наглядности расписал так, поправь что б было компактней*/
.all_text {position:absolute; margin:10px 10px 10px 10px;}

не проверял, но думаю работает.

Это сообщение отредактировал(а) Ctulhy - 20.10.2008, 17:58

--------------------

скучно в Москве и дождливо в Крыму.

supervladislav

Дата 20.10.2008, 19:48 (ссылка)

(нет голосов)

Загрузка ...

///\\\///\\\///\\\

Профиль
Группа: Завсегдатай
Сообщений: 1771
Регистрация: 18.5.2006

Репутация: нет
Всего: -9

уфф вроде разобрался вот только решил проще сделать через дивы ,и загвоздка новая во всех браузерах нормально кроме оперы
Растягивать по y в опере никак нехотим

Код


#cen{background-color:#000000;background-image:url(../screen/polosasered.jpg);background-repeat:repeat-y;width:900px;height:100%;display:block;}

0 Пользователей читают эту тему (0 Гостей и 0 Скрытых Пользователей)
0 Пользователей:
« Предыдущая тема \| Вёрстка веб-сайтов \| Следующая тема »