Лента Каталог Файлы Форумы Услуги
ОсновноеRadiotalkПользовательское
Программирование
6   •   Посмотреть все темы

Таблица

 
1

3910
Дмитрий @Q-Tec
Кто-нить может помочь в нормальном построении таблицы, что бы при разном расрешении дисплея она никуда не уезжала, может конечно корявенько сделал, поправьте.

CSS Код:
<style>
#HeaderRight {width:951px; position:absolute;top: 21px;}
#HeaderRight { float: right; width: 518px; text-align: right; height: 22px;}
#HeaderTopLinks div {margin: 3px 10px 0px 0px; color: #333333;}
#HeaderTopLinks {width: 485px; float: right; height: 22px; overflow: hidden; line-height: 1.3em;}
#HeaderTopLinks div { font-size: 8pt; font-weight: bold; float: left;}
#HeaderTopLinks div a, #DelfiHeaderTopLinks div a:visited { text-decoration: none;}
#HeaderTopLinks div a:hover, #DelfiHeaderTopLinks div a:active { text-decoration: underline;}
#HeaderTopLinks #DelfiHeaderTopRss { margin: 4px 9px 0px 0px;}
#HeaderTopLinks { width: 465px; background-color: #d9d9d9;}
#HeaderTopLinks div a, #HeaderTopLinks div a:visited, #HeaderTopLinks div a:hover, #HeaderTopLinks div a:active { color: #333333;}
div.HeaderTopSep { background-color: #b7b7b8;}
div.HeaderTopSep { margin-top: 0px !important; width: 1px; height: 22px; font-size: 0px; float: right;}
#HeaderTopDiagonal { background-image: url('style_images/bar/top_diagonal_white.gif'); width: 32px;}
#HeaderTopDiagonal { background-repeat: no-repeat; float: right; height: 22px; font-size: 0px;}
#HeaderTopDiagonal-right { background-image: url('style_images/bar/top_diagonal_white_right.jpg'); width: 490px;right: 0px;top:21px;position:absolute;}
#HeaderTopDiagonal-right { background-repeat: no-repeat; float: right; height: 22px; font-size: 0px;}
</style>
HTML Код:
<div id="HeaderRight"><div id="HeaderTopLinks">
<div>
Вошли как: <a href="index.php?showuser=1">Deluxe</a></b> (<a href="index.php?act=Login">Выход</a>) ·
<a href="?act=UserCP&amp;CODE=00" title="Изменение личных данных, работа с личными сообщения и т.д.">Личные данные</a> ·
<a href="javascript:buddy_pop();" title="Обзор новых сообщений со времени вашего последнего посещения, список администраторов и т.д.">?</a> ·
<a href="http://free.pri.ee/admin/index.php" target="_blank">Админцентр</a></b>
</div>
</div><div id="HeaderTopDiagonal"></div></div><div id="HeaderTopDiagonal-right"></div>
********** - **********

Отредактировано Q-Tec - 28.04.2010
8497
Степан @Trilby
<html>
<head>
<style>
#HeaderRight {width:100%; position:absolute; top: 1px; right: 20px; z-index: 4;}
#HeaderRight { float: left; width: 100%; text-align: left; height: 22px;}
#HeaderTopLinks div {margin: 3px 10px 0px 0px; color: #333333;}
#HeaderTopLinks {width: 100%; float: right; height: 22px; line-height: 1.3em; padding-right: -50px;}
#HeaderTopLinks div { font-size: 8pt; font-weight: bold; float: left;}
#HeaderTopLinks div a, #DelfiHeaderTopLinks div a:visited { text-decoration: none;}
#HeaderTopLinks div a:hover, #DelfiHeaderTopLinks div a:active { text-decoration: underline;}
#HeaderTopLinks #DelfiHeaderTopRss { margin: 4px 9px 0px 0px;}
#HeaderTopLinks {background-color: #d9d9d9;}
#HeaderTopLinks div a, #HeaderTopLinks div a:visited, #HeaderTopLinks div a:hover, #HeaderTopLinks div a:active { color: #333333;}
div.HeaderTopSep { background-color: #b7b7b8;}
div.HeaderTopSep { margin-top: 0px !important; width: 1px; height: 22px; font-size: 0px; float: right;}
#HeaderTopDiagonal { background-image: url('http://free.pri.ee/style_images/bar/top_diagonal_white.gif'); position: absolute; top: 1px; left: 20px; width: 32px;}
#HeaderTopDiagonal { background-repeat: no-repeat; float: right; height: 22px; font-size: 0px;}
#HeaderTopDiagonal-right { background-image: url('http://free.pri.ee/style_images/bar/top_diagonal_white_right.jpg');right: 0px;top:1px; float: right; width: 30px; position:absolute; z-index: 5;}
#HeaderTopDiagonal-right { background-repeat: no-repeat; float: right; height: 22px; font-size: 0px;}
</style>


</head>

<div id="HeaderRight"><div id="HeaderTopLinks">
<div style='width:100%; margin-left: 60px;'>
Вошли как: <a href="index.php?showuser=1">Deluxe</a></b> (<a href="http://free.pri.ee/index.php?act=Login">Выход</a>) ·
<a href="?act=UserCP&amp;CODE=00" title="Изменение личных данных, работа с личными сообщения и т.д.">Личные данные</a> ·
<a href="javascript:buddy_pop();" title="Обзор новых сообщений со времени вашего последнего посещения, список администраторов и т.д.">?</a> ·
<a href="http://free.pri.ee/admin/index.php" target="_blank">Админцентр</a></b>&nbsp
</div>
</div><div id="HeaderTopDiagonal"></div></div><div id="HeaderTopDiagonal-right"></div>

</html>

Отредактировано Trilby - 28.04.2010
6600
Александр @admiral
Помоему так будет проще)
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=windows-1251">
<title>TITLE</title>
<style>
body {margin:0;padding:0;}
#HeaderRight {margin-top: 1px;}
#HeaderTopLinks {font-size: 10pt;font-weight: bold;color: #333333;background-color: #d9d9d9;height: 22px; margin-left: 50px;margin-right: 150px;}
#HeaderTopLinks a, #HeaderTopLinks a:visited {font-size: 10pt; font-weight: bold;color: #333333;text-decoration: none;}
#HeaderTopLinks a:hover, #DelfiHeaderTopLinks a:active {text-decoration: underline;}
#HeaderTopDiagonal {background-image: url('http://free.pri.ee/style_images/bar/top_diagonal_white.gif'); position: absolute; top: 1px; left: 20px;width: 32px;height: 22px}
#HeaderTopDiagonal-right {background-image: url('http://free.pri.ee/style_images/bar/top_diagonal_white_right.jpg');width: 30px; position:absolute; height: 22px;top: 1px; right: 120px}
</style>
</head>
<body>
<div id="HeaderRight">
<div id="HeaderTopDiagonal"></div>
<div id="HeaderTopLinks">
Вошли как: <a href="index.php?showuser=1">Deluxe</a> (<a href="http://free.pri.ee/index.php?act=Login">Выход</a>) ·
<a href="?act=UserCP&amp;CODE=00" title="Изменение личных данных, работа с личными сообщения и т.д.">Личные данные</a> ·
<a href="javascript:buddy_pop();" title="Обзор новых сообщений со времени вашего последнего посещения, список администраторов и т.д.">?</a> ·
<a href="http://free.pri.ee/admin/index.php" target="_blank">Админцентр</a>&nbsp
</div>
<div id="HeaderTopDiagonal-right"></div>
</div>
</body>
</html>

То что выделено синим задает отступ справа, изменять равномерно оба параметра, но не забываем что он так же учитывается и во всей ширине