Уже очень давно интересно разрешить такую задачу.

Штрихованный фон - на нем размещается блок, контур которого бросает тень на эту штрихованную область.

Суть проблемы.
Штрихи на тени не стыкуются со штрихами на фоне (при 1280x1024 все ОК).
Верстка CSS.

Пример: gom.ucoz.ru/img/1l.jpg

Код:
 #page_bg { 
 * * * background: #fff url(images/index1.gif) repeat-x; 
 * * * margin: 0px 0px 0px 0px; 
 * *padding: 0px 0px 0px 0px; 
 * *text-align: center; 
 * * } 

 * * #main { 
 * * * height: 100%; 
 * * * margin-top: 40px; 
 * *margin-right: auto; 
 * *margin-left: auto; 
 * * * text-align: left; 
 * * * width: 924px; 
 * * } 

/* верхняя полоса */ 
 * * #top1 { 
 * * * position: relative; top: 0px; left: 0px; 
 * * * background: url(images/top1.jpg) no-repeat; 
 * * * width: 12px; 
 * * * height:10px; 
 * * * float: left; 
 * * } 

 * * #top2 { 
 * * * background: url(images/top2.jpg) repeat-x; 
 * * * width: 900px; 
 * * * height:10px; 
 * * * float: left; 
 * * } 

#top3 { 
 * * * background: url(images/top3.jpg) no-repeat; 
 * * * width: 12px; 
 * * * height:10px; 
 * * } 
 * * * </style> 
</head> 

<body id="page_bg"> 
<div id="main"> 
 * * * <div id="top1"></div> 
 * * * <div id="top2"></div> 
 * * * <div id="top3"></div> 
</div> 
</body>