За последние 24 часа нас посетили 21692 программиста и 1690 роботов. Сейчас ищут 1949 программистов ...

Как сделать DIV в ряд слева направо?

Тема в разделе "HTML и CSS", создана пользователем Insonicum, 16 июл 2009.

  1. Insonicum

    Insonicum Активный пользователь

    С нами с:
    6 июл 2009
    Сообщения:
    12
    Симпатии:
    0
    Нужна помощь по Css.

    Не получается сделать надписи вверху таблицы и выровнять их. получается, что надпись Nord Land
    выше уезжает. а надо сделать чтоб она была на одном уровне вместе с Вход и Регистрация.


    посмотреть тут: http://frolov4.mybsd.ru/

    спасибо.
    Код (Text):
    1. <?php
    2. session_start();
    3. $_SESSION['login'] = $_POST['login'];
    4. $_SESSION['mail'] = $_POST['mail'];
    5. ?>
    6. <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
    7. <html>
    8. <head>
    9. <bgsound src="C:\Apache_Swissknife\Сайты\localhost01\html\forma\SNOW.mp3" loop="1">
    10. <meta http-equiv="Content-Type" content="text/html; charset=windows-1251">
    11. <title>
    12. New project
    13. </title>
    14. <style type="text/css">
    15. BODY {
    16.     margin: 0; /* Убираем отступы */
    17.       }
    18.        a {
    19.   font-family: Arial;
    20.   cursor:pointer;
    21.   text-decoration: none;
    22.   color:skyblue;
    23.   }
    24.  
    25.   table { border-collapse: collapse; }
    26.  
    27.  .parent {
    28.     margin-top: 35px; /* Отступы вокруг элемента */
    29.     margin-left: 225px; /* Отступ слева */
    30.     margin-right: 225px;
    31.     margin-bottom: 85px;
    32.     padding-bottom: 50px;
    33.     background: #99CCFF; /* Цвет фона */
    34.     padding: 10px; /* Поля вокруг текста */
    35.    }
    36.  
    37.   .child {
    38.     text-align: center;
    39.     font-family: Verdana;
    40.     font-size: 14px;
    41.     border: 3px solid #155; /* Параметры рамки */
    42.     padding: 10px; /* Поля вокруг текста */
    43.     margin: 0px; /* Отступы вокруг */
    44.    }
    45.  
    46.  .top {
    47.     margin-top: 85px;
    48.     text-align: center;
    49.     font-family: Verdana;
    50.     font-size: 14px;
    51.     color: white;
    52.  }
    53.  
    54.  .layer1 {
    55.    
    56.     padding-left: 80px; /* Отступ слева */
    57.     padding-bottom:0px;
    58.     background-image:url(.jpg);
    59.     font-size: 25px;
    60.     font-family: Arial;
    61.     color: lightblue; /* Цвет шрифта */
    62.    }
    63.    
    64.    .layer2 {
    65.     font:bold;
    66.     margin-left: 1000px;
    67.     padding-left: 10px; /* Поле слева */
    68.     color: white;
    69.     font-family: ;
    70.     font-size: 15px;
    71.    }
    72.    
    73.   .ots {
    74.     margin-top: 0px; /* Отступы вокруг элемента */
    75.     margin-left: 0px; /* Отступ слева */
    76.     margin-right: 0px;
    77.     margin-bottom: 0px;
    78.     padding: 0px;
    79.   }
    80.  
    81.    .ots2 {
    82.   margin-left: 180px; /* Отступ слева */
    83.   padding: 0px;
    84.  
    85.  
    86.   .mainborder {
    87.   border: 1px solid #ACB3B5;
    88.     background-color : White;
    89.     width: 100%;
    90.    margin-top:0px;
    91.   padding-left: 80px;
    92.   padding-right: 80px;
    93.   }
    94.  
    95.   </style>
    96.  </head>
    97.  
    98.  
    99.  
    100.  
    101.   <div class="layer1">
    102.  <a href = "00001.php" style="cursor:pointer; text-decoration: none; color: lightblue;">Nord Land</a>
    103.        <div class="layer2">
    104.   <a href = "00001.php"> <b>вход</b></a>&nbsp;&nbsp;&nbsp;&nbsp; <b>регистрация</b>
    105. </div>
    106.    </div>  
    107.    
    108.  
    109.  
    110.  
    111.    <body bgcolor = "black">
    112.  
    113.  
    114. <table border="1" cellpadding ="0px" cellspacing="0px" background="topfon.jpg"  style="margin-top:0px; margin-bottom:0px; margin-left:100px; margin-right:170px;">
    115. <tr>
    116. <td width = "100" height="0">
    117.  <div class="ots">
    118. <img src = "top.jpg" width = "1070" height = "190">
    119. </div>
    120. </td>
    121. </tr>
    122.  
    123. <tr>
    124.  
    125.  
    126.  
    127. <td width="55%" height="0%">
    128. <b>
    129.  
    130. <div class="top">
    131. Регистрация нового пользователя
    132. </div>
    133.  
    134. <br>
    135. <form name = "id" action = "2.php" method = "POST">
    136.  
    137.  <div class="parent">
    138.    <div class="child">
    139.  Введите своё имя &nbsp; &nbsp; &nbsp;&nbsp;
    140. <input type = "text" name = "login" size="19" MAXLENGHT="20" style="background-image:url(topfon4.jpg)">
    141.  
    142. <br><br>
    143. Введите пароль &nbsp; &nbsp; &nbsp;&nbsp;&nbsp; &nbsp;
    144. <input type = "text" name = "password" size="19" MAXLENGHT="20" style="background-image:url(topfon4.jpg)">
    145. <br><br>
    146. Подтвердите пароль &nbsp;&nbsp;
    147. <input type = "text" name = "password2" size="19" MAXLENGHT="20" style="background-image:url(topfon4.jpg)">
    148. <br><br>
    149.  
    150. <br>
    151. Дополнительная информация о себе
    152. <br>
    153. <br>
    154. <textarea name = "info" rows = "10" cols = "50" style="background-image:url(778.jpg)"></textarea>
    155. <br>
    156. <input type = "submit" name = "a" value = "Добавить" style="background-image:url(sub3.jpg)">
    157.  
    158. </div>
    159. </div>
    160.  
    161. </form>
    162.  
    163.  
    164.  
    165.  
    166. <br>
    167. </td>
    168. </tr>
    169. </table>
    170. </b>
    171. </body>
    172. </html>
    [/html]
     
  2. Arlekina

    Arlekina Активный пользователь

    С нами с:
    13 июл 2009
    Сообщения:
    1
    Симпатии:
    0
    В свойства .layer1 надо дописать float:left;
    В .layer2 - float: right;

    И чуток кодик отредактировать.

    Код (Text):
    1.  
    2. <div class="layer1">
    3.      <a href = "00001.php" style="cursor:pointer; text-decoration: none; color: lightblue;">Nord Land</a>
    4. </div>
    5. <div class="layer2">
    6.   <a href = "00001.php"> <b>вход</b></a>     <b>регистрация</b>
    7. </div>
    8. <div style="clear:both;"></div>
    9.