Вопрос
Как создать меню с правой стороны страницы с обтеканием текстом?
Ответ
Можно предложить такой вариант. Работает в IE, Opera, NN 6.x. В NN 4.x меню отображается сверху, а не справа, и в одну строчку.
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN""DTD/xhtml1-strict.dtd">
<html>
<head>
<title>Меню справа с обтеканием текстом.</title>
<meta http-equiv="Content-Type" content="text/html; charset=windows-1251">
<style type="text/css" media="all">
#menu {
border:1px solid black;
width: 20%;
background-color:#c0c0c0;
padding: 5px;
margin: 5px;
float: right;
}
a {
clear:right;
display: block;
width:100%;
text-decoration:none;
font-size:13px;
font-weight:bold;
}
a:link {
color:Maroon;
text-decoration:none;
}
a:visited {
color:Maroon;
text-decoration:none;
}
a:hover {
color:Red;
text-decoration:none;
background-color:#ffcc66;
}
.text {
font-family: Arial, sans-serif;
border: 1px solid;
padding: 5px;
margin: 5px;
background-color:gainsboro;
}
</style>
</head>
<body>
<div id="menu" class="menu">
<a href="menu1.shtml">Меню 1</a>
<a href="menu2.shtml">Меню 2</a>
<a href="menu3.shtml">Меню 3</a>
<a href="menu4.shtml">Меню </div>
<div class="text">
Content. Content. Content. Content. Content. Content. Content. Content.Content.
Content. Content. Content. Content. Content. Content. Content. Content.Content.
</div>
</body>
</html>
Nikolai Prokoschenko, Igor Komlew
Более удобный вариант для NN 4.x:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<html>
<head>
<title>Пример 2a</title>
<meta http-equiv="Content-Type" content="text/html; charset=windows-1251">
<STYLE TYPE="text/css"><!--
body
{
background-color:white;
color:black;
font-family:Verdana,Arial,"sans-serif";
text-align:justify;
}
div
{
position:absolute;
}
.text {
margin-top: 10pt;
left: 5%; width: 70%;
text-align:justify;
color:black;
}
div.td1
{
margin-top: 10pt;
background-color:green;
color:white;
left: 78%; width: 16%;
min-height: 100px;
min-width: 150px;
font-weight:bold;
font-family:Verdana;
font-size: 10pt;
}
-->
</STYLE>
</head>
<body>
<div class="td1">
Вот тут у нас навигационная панелька.<br> Довольно неплохой вариант
размещения больших статей
</div>
<div class="text">
А тут у нас идет текст статьи …
А тут у нас идет текст статьи …
А тут у нас идет текст статьи …
</div>
</body>
</html>
rts
Copyright 
2000-2004 Сообщество Чайников
Контактная информация