0
Я пытаюсь сделать сайт похожим на настольное приложение ... Он будет похож на Program Manager из Windows 3.1, за исключением того, что мне нужно, чтобы группы значков изменялись и изменялись в зависимости от количества значков i иметь и сколько места им нужно. им не нужно занимать 100% пространства внутри, но, по крайней мере, делать 2 - 3 столбца и заполнять пустые пространства И им не нужно фиксировать ширину.CSS: dynamic Icon Window
Что я получаю 
Я пытаюсь для
body
{
\t padding: 5px;
\t height: 99%;
\t margin: 0;
}
#mainWin
{
\t border-color: Black;
\t border-width: 1px;
\t border-style: Solid;
\t border-radius: 10px;
\t display: table;
\t width: 100%;
\t height: 100%;
}
#titleBar
{
\t background-color: blue;
\t border-top-left-radius: 9px;
\t border-top-right-radius: 9px;
\t text-align: center;
\t height: 17px;
\t padding: 2px;
\t color: white;
\t display: table-cell;
\t width: 100%;
}
#Wrapper
{
\t border: solid black 1px;
\t display: table-row;
\t height: 100%;
\t padding:5px
}
#cellWrapper
{
\t padding: 5px;
\t display: table-cell;
}
#statusBar
{
\t background-color: lightgray;
\t border-bottom-left-radius: 9px;
\t border-bottom-right-radius: 9px;
\t height: 17px;
\t padding: 2px 2px 2px 10px;
\t color: black;
\t display: table-cell;
}
.Window
{
\t border-color: Black;
\t border-width: 1px;
\t border-style: Solid;
\t border-radius: 10px;
\t display: table;
\t width: 45%;
\t margin:5px;
}
.titleWindow
{
\t background-color: blue;
\t border-top-left-radius: 9px;
\t border-top-right-radius: 9px;
\t text-align: center;
\t height: 17px;
\t padding: 2px;
\t color: white;
\t display: table-cell;
\t width: 100%;
}
.wrapWindow
{
\t border: solid black 1px;
\t display: table-row;
\t height: 100%;
\t padding:5px
}
.wrapcellWindow
{
\t padding: 5px;
\t display: table-cell;
}
.stausWindow
{
\t background-color: lightgray;
\t border-bottom-left-radius: 9px;
\t border-bottom-right-radius: 9px;
\t height: 17px;
\t padding: 2px 2px 2px 10px;
\t color: black;
\t display: table-cell;
}<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
\t <title></title>
\t <link href="/CSS/Service.css" rel="stylesheet" />
</head>
<body>
\t <form id="form1">
\t <div id="mainWin">
\t \t <div id="titleBar">
\t \t \t Consumer Lawncare Inventory Tracking System
\t \t </div>
\t \t <div id="Wrapper">
\t \t \t <div id="cellWrapper">
\t \t \t \t <div class="Window">
\t \t \t \t \t <div class="titleWindow">
\t \t \t \t \t \t Some Window
\t \t \t \t \t </div>
\t \t \t \t \t <div class="wrapWindow">
\t \t \t \t \t \t <div class="wrapcellWindow">
\t \t \t \t \t \t \t The inside it 1 <br />qweqweq<br />qweq<br />qwe<br />qweqw<br /><br />qweqweqwe<br />qweqweqwe<br />qweqweq<br />weqweq
\t \t \t \t \t \t </div>
\t \t \t \t \t </div>
\t \t \t \t \t <div class="stausWindow">
\t \t \t \t \t \t Some Status Bar
\t \t \t \t \t </div>
\t \t \t \t </div>
\t \t \t \t <div class="Window">
\t \t \t \t \t <div class="titleWindow">
\t \t \t \t \t \t Some Window
\t \t \t \t \t </div>
\t \t \t \t \t <div class="wrapWindow">
\t \t \t \t \t \t <div class="wrapcellWindow">
\t \t \t \t \t \t \t The inside it 2
\t \t \t \t \t \t </div>
\t \t \t \t \t </div>
\t \t \t \t \t <div class="stausWindow">
\t \t \t \t \t \t Some Status Bar
\t \t \t \t \t </div>
\t \t \t \t </div> <div class="Window">
\t \t \t \t \t <div class="titleWindow">
\t \t \t \t \t \t Some Window
\t \t \t \t \t </div>
\t \t \t \t \t <div class="wrapWindow">
\t \t \t \t \t \t <div class="wrapcellWindow">
\t \t \t \t \t \t \t The inside it 3
\t \t \t \t \t \t </div>
\t \t \t \t \t </div>
\t \t \t \t \t <div class="stausWindow">
\t \t \t \t \t \t Some Status Bar
\t \t \t \t \t </div>
\t \t \t \t </div>
\t \t \t </div>
\t \t </div>
\t \t <div id="statusBar">
\t \t \t Ready
\t \t </div>
\t <div>
\t </form>
</body>
</html>