[ Поиск ] - [ Пользователи ] - [ Календарь ]
Полная Версия: помогите преобразовать table в div...
MatrixGod
всем привет!

помогите пожалуйста преобразовать в обычный div.
я в принципе и сам сделал...
но как не крути, как не верти он не хочет ни в какую быть по среди экрана.
а если оставить table то он как и надо по середине...

в общем, главное чтоб он был ровно по среди экрана!

<div style="position:absolute; z-index:9; top:150px; width:100%;" id="bigform">
<table
border="0" width="100%">
<tr>
<td
align="center">
<table
border="0" width="650">
<tr>
<td
align="center">
<table
border="0" cellspacing="0" cellpadding="0" width="400" height="350">
<tr>
<td
valign="top" style="background-color:black" align="center">
<br>
<form
style="margin:0px;" method="POST" onsubmit="return check_form(this);">
<table
border="0" cellspacing="0" cellpadding="0">
<tr>
<td
style="font-size:20px; font-weight:bold; color:#FFFFFF;">asdasdasd</td>
</tr>
<tr>
<td
align="center" style="padding-top:25px;"><textarea name="input_text" border="0" style="border:solid 1px #eeeeee; width:350px; height:200px; font-size:16px;"></textarea></td>
</tr>
<tr>
<td
align="center" style="padding-top:25px;"><input type="submit" style="border:solid 1px #eeeeee; color:#000000; width:150px; font-size:20px; height:40px;" value="send"></td>
</tr>
</table>
</form>
<br>
</td>
</tr>
</table>
</td>
</tr>
</table>
</td>
</tr>
</table>
</div>




Спустя 3 часа, 40 минут, 18 секунд (18.07.2010 - 18:26) MatrixGod написал(а):
никто не поможет?
или просто скажите как поставить див по середине!
маргин ауто не помогает...

Спустя 6 минут, 6 секунд (18.07.2010 - 18:32) Michael написал(а):
по горизонтали выровнять:
margin-left:auto;
margin-right:auto;
и указана ширина div-а

По вертикали такое не прокатит.

Спустя 3 минуты, 20 секунд (18.07.2010 - 18:36) Michael написал(а):
Вспомнил:
для вертикального выравнивания эл-та нужно его и родителя сделать position:relative;
И центрируемому элементу поставить top:50%; и margin-top: отрицательное значение в пикселях равное 25% высоты контейнера.

Спустя 3 минуты, 45 секунд (18.07.2010 - 18:39) MatrixGod написал(а):
Michael
нифига не понял.
можно на примере?

Спустя 9 минут, 13 секунд (18.07.2010 - 18:49) MatrixGod написал(а):
почему если дать маргину значения в процентах или пикселях, оно работает.
а если дать ауто то уже нет?

<div style="margin: 0 30%">
... code ...
</div>

<div
style="margin: 0 300px">
... code ...
</div>

<div
style="margin: 0 auto">
... почему не пашет млин? ...
</div>

Спустя 1 минута, 31 секунда (18.07.2010 - 18:50) Michael написал(а):
Цитата
нифига не понял.
можно на примере?


<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd"
>
<html>
<head>
<title>
Untitled Document</title>
<meta
http-equiv="Content-Type" content="text/html; charset=windows-1251">
<style
type="text/css">
#div1 {
background-color:#00CC66;
width:600px;
height:400px;
position:relative;
border:1px solid black;
}
#div2 {
background-color: #FF3333;
width:300px;
height:200px;
position:relative;
top:50%;
margin:-100px auto 0 auto;
border:1px solid black;
}
</style>
</head>

<body>
<div
id="div1"><div id="div2">Я круто отцентрирован</div></div>
</body>
</html>



Спустя 6 минут, 32 секунды (18.07.2010 - 18:57) Michael написал(а):
<div style="margin: 0 auto">
... почему не пашет млин? ...
</div>

а ширину указать из которой уже будет посчитаны отступы, заданные как auto ?

Спустя 4 минуты, 47 секунд (18.07.2010 - 19:01) Reflex написал(а):
Если только горизонтально выровнять, то всё просто, нужно всем родителям ширину указать:
html, body {width: 100%; margin: 0; padding: 0;}
/* Это если всё резиновое и в процентах */


А если нужно ещё и вертикально выровнять, то можно посмотреть пример.

Спустя 1 час, 1 минута, 11 секунд (18.07.2010 - 20:03) MatrixGod написал(а):
всем огромное спасибо... уже разобрался!

Спустя 1 день, 19 часов, 57 минут, 54 секунды (20.07.2010 - 16:01) Gesandte написал(а):

*{
margin: 0;
padding: 0;
}

body,html {
height: 100%;
}

body {
background: rgb(255,255,255);
width: 100%;
min-width: 1000px;
max-width: 1500px;
margin: 0 auto !important;
}

div.fixed_wrapper {
width: 100%;
height: 100%;
position: fixed;
}

div.fixed {
background: rgb(220,220,220);
width: 40%;
height: 300px;
position: relative;
top: 50%;
margin: 0 auto;
margin-top: -150px;
}

div.wrapper p {
width: 200px;
padding: 20px;
}



<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta
http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>
Фиксированный блок</title>
<link
href="style.css" rel="stylesheet" media="screen" type="text/css" />
</head>
<body>

<!--[if IE]>
<script type="text/javascript">
void(a=document.getElementsByTagName('*'));
alert("Внимание! Ваш браузер не поддерживается. Пожалуйста, используйте новую версию или любой «альтернативный» браузер, например Opera или Firefox");
for(i=0; i<a.length; i)
void(a[i].style.display='none');
void(a[i].innerHTML='');
</script>
<![endif]-->


<div class="fixed_wrapper">
<div
class="fixed">
fixed
</div>
</div>

<div
class="wrapper">
<p>

всем привет!
помогите пожалуйста преобразовать в обычный div.
я в принципе и сам сделал...
но как не крути, как не верти он не хочет ни в какую быть по среди экрана.
а если оставить table то он как и надо по середине...

в общем, главное чтоб он был ровно по среди экрана!
</p>
<div/>

</body>
</html>



Работает в опере, файрфоксе, хроме, 7 и 8 осле. В 6 осле нет, постваил запрет на отобожение в нем, собсна нефиг с таким хламом по сети лазить))))
Быстрый ответ:

 Графические смайлики |  Показывать подпись
Здесь расположена полная версия этой страницы.
Invision Power Board © 2001-2024 Invision Power Services, Inc.