VPF::ДИВ в ДИВЕ - Форум программистов

Папараццы

Дата 8.2.2007, 14:26 (ссылка)

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

Загрузка ...

Опытный

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

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

Нужно чтобы див появлялся внутри другова дива...Где то посередине....Вписываю внутри непонимаю почему не показывает вообще внутри его...
Так вот эт код
CSS

Код


 #middlebar{
border-bottom:none;
background:url(buttons/search3.jpg) no-repeat top left;
/* height:46px; */ 
}
#middlebar form{
margin:0;
padding: 10px 0px 9px 20px;
} 

 #nav {margin: 0px 0  0px 0;}  
    #nav {
      /*float:left;*/ 
      width:100%;
      background:#dae0d2 url("buttons/bg.gif") repeat-x bottom;
      }
    #nav ul {
      margin:0 auto;
      padding:0px 0px 0;
      list-style:none;
      display:table;
      }
    #nav li {
      display:table-cell;
      float:left;
      background:url("buttons/right_both.gif") no-repeat right top;
      margin:0 0 0 0px; /* 9px last */
      padding:0;
      }
    #nav a {
      display:block;
      position:relative;
      left:-9px;
      margin-right:-9px;
      width:.1em;
      background:url("buttons/left_both.gif") no-repeat left top;
      padding:5px 20px;
      text-decoration:none;
      font-weight:bold;
      color:#765;
      }
    #nav > ul a {width:auto;}
    /* Commented Backslash Hack hides rule from IE5-Mac \*/
    #nav a {float:none;}
    /* End IE5-Mac hack */
    #nav a:hover {
      color:#333;
      }
    #demos #nav-demos, 
    #menus #nav-menus,
    #layouts #nav-layouts, 
    #boxes #nav-boxes,
    #mozilla #nav-mozilla,
    #explorer #nav-explorer,
    #opacity #nav-opacity {
      background-position:100% -150px;
      }
    #demos #nav-demos a, 
    #menus #nav-menus a,
    #layouts #nav-layouts a, 
    #boxes #nav-boxes a,
    #mozilla #nav-mozilla a,
    #explorer #nav-explorer a,
    #opacity #nav-opacity a {
      background-position:0 -150px;
      padding-bottom:6px;
      color:#333;
      }
      /* not for IE5.x or IE6 */
    #nav li:hover, 
    #nav li:hover a {
      background-position:100% -150px;
      color:#333;
      }
    #nav li:hover a {
      background-position:0 -150px;
      }

А эт код HTML

Код


<div id="middlebar">
    <!-- SEARCH START --> 
     <form action='index.php?lang=<? echo "$lang"; ?>'> 
       <i>AZ EN</i><? //echo"<label>$search</label>"; ?>
       <input name="searchFor" type="text" size="11">
       <input name="axtar" type="submit" class="submit" value="">
       <!-- <? echo"#search"; ?>-->
      </form>
    <!-- SEARCH END-->
    
     <div id="nav">
      <ul>
        <li id="nav-demos"><a href="../menu/index.html">Demos</a></li>
        <li id="nav-menus"><a href="index.html">Menus</a></li>
        <li id="nav-layouts"><a href="../layouts/index.html">Layouts</a></li>
        <li id="nav-boxes"><a href="../boxes/index.html">Boxes</a></li>
      </ul>
    </div>
</div>

А здесь собственно видно что и как...
Ну новерное вы поняли нужно чтобы горизантальное меню было на верхней полосе...
http://elm.az/ict/library/infnew2/ritn/

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

/*---------------------------------------------------------------------------------*/

mishaSL

Дата 8.2.2007, 14:52 (ссылка)

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

Загрузка ...

Эксперт

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

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

Если ты решил полностью сделать все на дивах, то поиск ложишь в див:

Код


     <div id="formSearch"><form action='index.php?lang=AZ'>
       <i>AZ EN</i>       <input name="searchFor" type="text" size="11">

       <input name="axtar" type="submit" class="submit" value="">
       <!-- #search-->
      </form>
    <!-- SEARCH END-->
</div>

На него пишешь css:

Код


div#formSearch {
float: left;
width: 300px; //ширину посчитай точнее какую надо, это я к примеру, чтобы показать что она нужна
    }

На div#nav также ставишь float:left; и ширину, только поменьше чем 100%. На внешний блок ставишь clear:both;
и на все остальные дивы прописываешь либо float, либо clear

Вот так все в принципе просто.

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

Лучший способ научиться программированию - это посмотреть как это делают другие...

Папараццы

Дата 8.2.2007, 15:17 (ссылка)

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

Загрузка ...

Опытный

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

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

Всё дела в clear:both; да ?? Ато у меня раньше всё брал и если оба лефт то он под друг друга прописовал....

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

/*---------------------------------------------------------------------------------*/

mishaSL

Дата 8.2.2007, 15:38 (ссылка)

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

Загрузка ...

Эксперт

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

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

Папараццы, У тебя друг под друга было из-за того что ширина дива второго была 100%. clear - это свойство определяет, какие стороны блока, порожденного элементом, не могут соседствовать с предшествующим перемещаемым блоком. значение both - это очиства со всех сторон. Также есть left и right - этоо соответственно очистить с лево и право...

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

Лучший способ научиться программированию - это посмотреть как это делают другие...

Папараццы

Дата 8.2.2007, 15:51 (ссылка)

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

Загрузка ...

Опытный

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

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

С этим понятно....
http://elm.az/ict/library/infnew2/ritn/
Посмотри плз опять промежуток между меню появился паддинг меняю на 0 норм только search text коряво выводится... не понять что....
КОД

Код


#formSearch {
      margin:0;
      padding:  5px 0px 0px 10px ;
      float: left;
      width: 205px; //ширину посчитай точнее какую надо, это я к примеру, чтобы показать что она нужна
    }

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

/*---------------------------------------------------------------------------------*/

mishaSL

Дата 8.2.2007, 16:20 (ссылка)

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

Загрузка ...

Эксперт

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

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

Папараццы, ты уж конечно извини, но если ты хочешь нормально доверстать этот сайт, то приведи в порядок свой html и css код, а то шапку ты хочешь на дивах сделать а чуть ниже у тебя бешенные таблицы. Когда приведешь в порядок свой код, такие ошибки у тебя сами собой пропадут (а то у тебя классов в css по-моему раза в два больше чем надо). и если используешь наследование, то прописывай полный путь по блочным элементам к необходимому элементу. И еще было бы полезно сделать его валидным. smile

Это сообщение отредактировал(а) mishaSL - 8.2.2007, 16:25

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

Лучший способ научиться программированию - это посмотреть как это делают другие...

Папараццы

Дата 8.2.2007, 21:25 (ссылка)

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

Загрузка ...

Опытный

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

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

Реально никогда css ом не занимался ...Для меня реально мучение этот ИЕ и Мазилла на первом варианте всё бло нормально что случилось с этим нечего незнаю...Уже до пердриков надоел этот цсс не когда дизайном не занимался но приходится что делать...Всё заного зделаю и буду старатся оккуратно делать..Ато всё набрасывал набрасывал и получилось то что получилось....В Субботу всё переделавать буду...Если есть советы был бы блогадарен.... Спасибо тебе за помощь...

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

/*---------------------------------------------------------------------------------*/

mishaSL

Дата 9.2.2007, 14:25 (ссылка)

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

Загрузка ...

Эксперт

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

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

Цитата(Папараццы @ 8.2.2007, 21:25

)

Реально никогда css ом не занимался

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

Код


<table border='0' cellspacing='0' cellpadding='0'>

то напиши в css:

Код


table {
border-collapse: collapse;
border-spasing:0;
border:0;
}
table td {
padding: 0;
}

Если нужно могу тебе спецификацию css2 от w3c на русском скинуть.

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

Лучший способ научиться программированию - это посмотреть как это делают другие...

Папараццы

Дата 13.2.2007, 14:15 (ссылка)

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

Загрузка ...

Опытный

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

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

Буду благодарен[email protected] Можеш на мыло послать ?

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

/*---------------------------------------------------------------------------------*/

mishaSL

Дата 13.2.2007, 15:44 (ссылка)

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

Загрузка ...

Эксперт

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

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

На твою почту не хочет отправляться.

Вот прикрепил к сообщению, кому надо пользуйтесь...

Присоединённый файл ( Кол-во скачиваний: 28 )

css2ru.zip 711,52 Kb

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

Лучший способ научиться программированию - это посмотреть как это делают другие...

Папараццы

Дата 13.2.2007, 15:55 (ссылка)

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

Загрузка ...

Опытный

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

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

У меня отсюда еле ели качает....Ну полюбому респект...Пригодится эт точно...

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

/*---------------------------------------------------------------------------------*/

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