Вроде бы автору требовалось нечто такое по виду...
<!DOCTYPE html>
<html>
<head>
<title>Пыточная</title>
<style type="text/css">
* {
margin: 0;
padding: 0;
}
html,
body {
width: 100%;
}
#container {
position: relative;
background-color: silver;
}
#right {
float: right;
width: 200px;
position: relative;
}
#right > p {
position: absolute;
left: 3px;
right: 0;
}
#left {
margin-right: 200px;
background-color: #ffffff;
}
.end {
clear: both;
}
.line {
position: absolute;
right: 0;
height: 3px;
border-left: 1px solid ;
border-bottom: 1px solid;
border-color: red;
}
</style>
<script>
function SetPrm() {
var o=document.getElementById('left')
o=o.getElementsByTagName('b')
var i
for (i=0; i<o.length; i++) {
document.getElementById('p'+i).style.top=o[i].offsetTop+'px'
document.getElementById('b'+i).style.top=(o[i].offsetTop+15)+'px'
document.getElementById('b'+i).style.left=o[i].offsetLeft+'px'
}
}
</script>
</head>
<body onload='SetPrm()'>
<div id='container'>
<div id='b0' class='line'></div>
<div id='b1' class='line'></div>
<div id='b2' class='line'></div>
<div id='right'>
<p id='p0'>Примечание для "количеству"</p>
<p id='p1'>Примечание для "права"</p>
<p id='p2'>Примечание для "Яндекс"</p>
</div>
<div id='left'>
<p>Служба Яндекс.Рефераты предназначена для студентов и школьников, дизайнеров
и журналистов, создателей научных заявок и отчетов — для всех, кто относится к
тексту, как к <b>количеству</b> знаков.
</p>
<p>Нажав на кнопку «Написать реферат» вы лично создаете уникальный текст,
причем именно от вашего нажатия на кнопку зависит, какой именно текст получится —
таким образом, авторские <b>права</b> на реферат принадлежат только вам.
</p>
<p>Теперь никто не сможет обвинить вас в плагиате, ибо каждый текст <b>Яндекс</b>. Рефератов
неповторим. <br />Текстами рефератов можно пользоваться совершенно бесплатно, однако
при транслировании и предоставлении текстов в массовое пользование ссылка на
Яндекс.Рефераты обязательна.
</p>
<div class='end'></div>
</div>
</div>
</body>
</html>
