Показать сообщение отдельно
  #1 (permalink)  
Старый 02.09.2013, 23:21
Аспирант
Отправить личное сообщение для valyan Посмотреть профиль Найти все сообщения от valyan
 
Регистрация: 05.11.2012
Сообщений: 55

Div внутри div
Здравствуйте. Никак не пойму как мне сделать div с чертой внизу другого div. Есть такой код
<!DOCTYPE html>
<html>
<head>
<meta charset=utf-8 />
<title>JS Bin</title>
</head>
<body>
<div id="dialog">
  <div>
    <p>
      <font style='color: #2878af; font-size: 21px; font-family: Segoe_light;'> шоссе 144а</font><br>    <font style='font-size: 13px; font-family: Segoe_Semibold;'>заказов 2</font>
    </p>
  </div>
  <div id='orders'>
    <div class='line-1'></div>
    <p class='porders' id='porders1'>
      <table class='listorder'>
        <tr>
          <td>Заказ № 150</td>
          <td style='text-align:right;'>14:04</td></tr>
        <tr>
          <td>ул.Маршала Жукова дом12, кв 23<br/>статус кухни<br/>5</td>
          <td style='text-align:right;' valign='top'>14:04</td>
        </tr>
    </table>
  </p>
  <div class='line-1'></div>
  <p class='porders' id='porders0'>
    <table class='listorder'>
      <tr>
        <td>Заказ № 178</td>
        <td style='text-align:right;'>19:06</td>
      </tr>
      <tr>
        <td>ул.Маршала Жукова дом12, кв 23<br/>статус кухни<br/>undefined</td>
        <td style='text-align:right;' valign='top'>19:06</td>
      </tr>
  </table>
  </p>
  </div>
  <div id='component'> 
	<div class='line-1'></div>
	  <p >
        <input  type='button' id='CloseBtn' class='MapButton' value='Закрыть' />
    </p>
  </div>
</div>
</body>
</html>


и css
Код:
#dialog {
    border: 1px solid silver;
    /*margin: 15px;*/
    padding-left: 20px;
    padding-right: 20px;
    /*border-radius: 10px;/* закругленные углы*/
    width: 20%;
    position: absolute;
    z-index: 999;
    height: 85%;
    background: rgba(240, 240, 240, 0.9);
    /*bottom: 100px; /* Положение от нижнего края */
    top: 30px; /* положение от ыерхнего края */
    right: 25px; /* Положение от правого края */
    /*overflow: auto;*/
    font-size: 11px;
}

#dialog p
{
    margin: 0; /* Убираем отступы вокруг */
    padding-top: 5px;
    padding-bottom: 7px;
}
.line-1 
{ 
  border-top: 1px solid #c8c8c8; 
  border-bottom: 1px solid #fff; 
  height: 0px; 
}
.porders
{
	cursor: pointer;
}

.MapButton 
{
        color: #333333;
        background: yellow;
        border: 1px dotted #83B8C7;
        margin-top: 20px;
}
.listorder
{
	font-size: 11px;
	width: 100%;
	
}
#component
{
    position: absolute;
    bottom: 0px;
  right: 10px;
}
Получить черту и кнопку, привязанную к родительскому div снизу.
Ответить с цитированием