У меня есть основной div в центре моей страницы с идентификатором "panel".
Я хочу расположить другой div, "панель инструментов", чтобы он был выровнен по верху и выровнен по бокамdiv "panel"
Примерно так: 
И я хочу, чтобы div панели оставался по центру.(В настоящее время это делается путем установки поля margin-left / margin-right на auto)
Абсолютное позиционирование на панели инструментов нарушается при изменении размера окна.
Я также пытался поместить их в оболочку, но это неизменно перемещает панель из центра ...
Такое ощущение, что все должно быть просто, я что-то упускаю?Каков наилучший способ сделать это?
Текущий живой пример здесь: Пример
Спасибо за любой совет ..
Разметка:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xml:lang="en-US" lang="en-US" xmlns="http://www.w3.org/1999/xhtml">
<head>
<title></title>
<link href="style.css" rel="stylesheet" type="text/css" />
</head>
<body>
<div id="toolbar">
Toolbar
</div>
<div id="panel">
Panel
</div>
</body>
</html>
CSS:
#toolbar{
border:1px solid black;
color:red;
width:100px;
height:200px;
}
#panel{
border:1px solid black;
color: blue;
margin-left:auto;
margin-right:auto;
width:500px;
height:500px;
}