|
|
|
| подскажите как сделать что-бы при верстки таким способом при уменьшении размеров окна браузера элементы "блок2" и "блок3" невыходили за пределы окна .
<div id="header" style=" height: 120px;"><h2>1-ый блок</h2></div>
<div style="position: relative; top: -100px; margin-bottom: -100px; z-index: 5; height: 100px; padding-left: 900px;">Блок2</div>
<div style="position: relative; top: -130px; margin-bottom: -100px; z-index: 5; height: 100px; padding-left: 900px;">Блок3</div>
|
или может быть есть другой вариант? | |
|
|
|
|
|
|
|
для: dod
(18.04.2008 в 16:01)
| | px можно поменять на % | |
|
|
|
|
|
|
|
для: dod
(18.04.2008 в 16:01)
| |
<div style="position: relative;width: 100%;">
<div style="width: 200px;position: absolute;left: 0px;top: 0px;">Блок1</div>
<div style="margin-left: 200px;">Блок2</div>
</div>
|
| |
|
|
|
|
|
|
|
для: Niks1
(18.04.2008 в 19:32)
| | width помоему даже ставить не нужно. он сам по умолчанию станет 100%. | |
|
|
|
|
|
|
|
для: dod
(18.04.2008 в 16:01)
| | Пробуй и все похожее написать так
? - всмысле цыфра
........ - параметрт | |
|
|
|
|
|
|
|
для: dod
(18.04.2008 в 16:01)
| |
<div id="header" style="height: 120px;margin-right:100px;">
<h2>1-ый блок</h2>
<div style="position:absolute;height: 100px;right:0px;border:1px solid black;top:0px;">
Блок2
</div>
<div style="position:absolute;height: 100px;right:0px;border:1px solid black;">
Блок3
</div>
</div>
|
покатит? | |
|
|
|
|
|
|
|
для: mechanic
(19.04.2008 в 12:13)
| | немного не-то , желательно что-бы было не абсолютное позиционирование а относительное , а-то так получается что блок скачет по экрану ! | |
|
|
|
|
|
|
|
для: dod
(19.04.2008 в 16:00)
| | Нет , все безполезно !
Все равно вылазит при уменьшении окна :
#header {
margin: 0 0 0.2em 0;
padding: 1em 1.5em;
height:8em;
background: #343434 url('header.jpg') no-repeat top left ;
border:1px solid ##2D5289;;
}
<div id="header">
<div style="position: relative;width: 100%;">
<div style="width: 100%;position: absolute;left: 0px;top: 0px;">
<div style="margin-left: 85%;"><form name="" action="" method="post">
<table width='200' border='0' cellspacing='0' cellpadding='0' class='3'>
<tr>
<td align='center' class='3'>Имя:<br> Пароль:</td>
<td align='center' class='3'><input style="padding-left:20px" name="Name" type="text" value="" size="15">
<br> <input style="padding-left:20px" name="Name" type="text" value="" size="15">
<br> </td>
</tr>
<tr>
<td align='center' class='3'> </td>
<td align='center' class='3'><input name="submit" type="submit" value="Send" /></td>
</tr>
<tr>
<td align='center' class='3'> </td>
<td align='center' class='3'><a href="">Регистрация</a>
<hr width=80 /></td>
</tr>
<tr>
<td align='center' class='3'> </td>
<td align='center' class='3'><a href="">Забыли пароль?</a> </td>
</tr>
</table>
</form>
</div>
</div>
</div>
</div>
|
Как - же сделать что-бы невылазило ? | |
|
|
|
|
|
|
|
для: dod
(19.04.2008 в 22:18)
| | Так нравится?
<div id="header">
<form name="" action="" method="post" >
<table width='200' border='1' cellspacing='0' cellpadding='0' class='3' align="right">
<tr>
<td align='center' class='3'>Имя:<br> Пароль:</td>
<td align='center' class='3'><input style="padding-left:20px" name="Name" type="text" value="" size="15">
<br> <input style="padding-left:20px" name="Name" type="text" value="" size="15">
<br> </td>
</tr>
<tr>
<td align='center' class='3'> </td>
<td align='center' class='3'><input name="submit" type="submit" value="Send" /></td>
</tr>
<tr>
<td align='center' class='3'> </td>
<td align='center' class='3'><a href="">Регистрация</a>
<hr width=80 /></td>
</tr>
<tr>
<td align='center' class='3'> </td>
<td align='center' class='3'><a href="">Забыли пароль?</a> </td>
</tr>
</table>
</form>
</div>
|
| |
|
|
|