i got the actual area to align, now i am having problems with the triangles.. please help..
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="content-type" content="text/html; charset=utf-8" />
<title>Kasper</title>
<link href="css/main.css" type="text/css" rel="stylesheet" />
<link href="css/nav.css" type="text/css" rel="stylesheet" />
<!--[if IE ]>
<link href="css/ie.css" type="text/css" rel="stylesheet" />
<![endif]-->
</head>
<body>
<div class="banner">
<img src="images/kasper_banner.png" width="50%" />
</div>
<div class="triangle-l"></div>
<div class="triangle-r"></div>
<div id="area">
<div class="infobox-container">
<div class="infobox">
<h2>Site Navigaton</h2>
<li>
<ul><a href="index.html">Home</a></ul>
<ul><a href="contact.html">Contact Us</a></ul>
<ul><a href="charity.html">Charity</a></ul>
<ul><a href="services.html">Services</a></ul>
<ul><a href="about-us.html">About Us</a></ul>
</li>
</div>
</div>
<div class="content">
<h1>Welcome</h1>
<p>
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Duis urna dui, fringilla vel accumsan ut, convallis ac libero. Mauris porta vulputate magna, eget tempus ante consequat fringilla. Aenean eu diam in erat bibendum pretium id facilisis arcu. Curabitur lacinia imperdiet tellus sed placerat. Morbi facilisis, tellus vitae malesuada volutpat, enim libero mollis lacus, a venenatis diam tortor ut ligula. Fusce et est ut nisi pretium condimentum. Integer commodo luctus elit sit amet ullamcorper. Donec non nisi mi. Aenean consequat euismod sem ac consequat. *beep* sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Praesent porta convallis dui. Donec est diam, sollicitudin sit amet auctor vel, lobortis vel sapien. Aenean sapien eros, fringilla id faucibus vel, cursus id lacus. Nulla lectus ipsum, cursus non vehicula ac, scelerisque at mi. Sed semper ullamcorper nisi, interdum blandit ligula volutpat in. Phasellus congue sapien quis felis mattis ultrices.
Proin imperdiet, purus sit amet fringilla scelerisque, magna mi venenatis lectus, nec facilisis risus tortor eleifend dolor. Donec commodo commodo metus. Etiam vel urna erat. Nunc ut orci vel mi malesuada imperdiet vel quis nulla. Integer mattis malesuada eros, eu convallis sem interdum ut. Sed ac pellentesque ipsum. Vivamus dapibus, lectus sed pulvinar blandit, lectus velit tincidunt purus, sit amet sollicitudin ante purus nec nulla. Etiam at sem ac turpis porttitor ullamcorper.
Curabitur vitae convallis turpis. In ac sapien vel tellus dignissim facilisis sagittis sit amet sem. Morbi aliquam, elit nec luctus convallis, quam enim rhoncus velit, vel mollis tortor urna at tortor. Etiam bibendum rhoncus purus, vel suscipit tellus placerat id. Duis sed lacus id elit sagittis congue. Curabitur interdum, nisi in pharetra posuere, purus ligula lobortis lectus, eu rutrum sem nisi vel felis. Integer dictum malesuada bibendum. Etiam eget sagittis nunc. Quisque faucibus orci a velit pulvinar in adipiscing leo gravida. Etiam commodo turpis sit amet nulla consectetur dapibus egestas lacus interdum. Nullam ac rhoncus orci. Integer cursus lacinia urna, sed adipiscing risus placerat ullamcorper. Quisque sodales libero sed neque sagittis faucibus. Morbi purus sapien, feugiat sit amet vehicula a, bibendum et urna. Duis tellus nulla, condimentum non fermentum at, mattis nec lectus. Donec pretium pretium porttitor.
Curabitur faucibus augue ac dui placerat eleifend. Suspendisse eu nunc at augue faucibus faucibus. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Vivamus pretium urna et diam dignissim eu elementum nisi aliquam. Fusce iaculis vehicula massa quis pretium. Donec cursus molestie sapien vitae eleifend. Nam eget vestibulum urna. Ut vel auctor nisi. Vivamus egestas nibh ut mi blandit aliquet. Suspendisse potenti.
Nullam eget mauris nulla, ut pharetra libero. Nulla mattis nulla eu lacus tempus rutrum. Donec pharetra porta diam. *beep* sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Curabitur eu tempor odio. Integer tincidunt viverra nibh, eget ullamcorper erat feugiat at. Donec consequat, enim non varius pulvinar, ante neque viverra metus, ac tempus lacus metus sed magna. Maecenas sapien ante, pretium sit amet dictum non, sodales sit amet libero. Fusce hendrerit ligula eget erat consectetur dapibus. Vivamus cursus porttitor arcu, ut porttitor enim congue non. Aliquam eu est tortor.
Integer ac nulla id neque gravida vulputate at sed est. Nulla erat augue, hendrerit ac ullamcorper eget, iaculis a dolor. Nulla mattis aliquam dui in bibendum. Nunc id dui lectus, eu malesuada magna. Phasellus sed mauris vitae elit ornare pellentesque a in eros. Nam lacus dolor, pharetra a luctus vel, aliquet id dolor. Donec nec nisi mi, vel convallis tortor. Nullam rhoncus nunc sed magna rutrum vel porta erat porta. Aliquam sit amet metus sit amet quam rhoncus tincidunt eu non lacus.
Nulla ac enim ut lorem iaculis venenatis vel id augue. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Phasellus vitae convallis erat. Nulla ut odio a metus adipiscing condimentum vitae eu dolor. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Suspendisse nec dui sed ipsum viverra fringilla. Integer venenatis laoreet libero, sed auctor tellus suscipit in. Cras euismod, quam at faucibus porttitor, sapien velit dictum tortor, ac tempor neque turpis quis massa. Nunc vehicula justo volutpat mauris imperdiet convallis.
etra sed aliquam dolor vestibulum. In hendrerit hendrerit posuere. Quisque adipiscing sem vel nisl ornare at pellentesque lectus congue. Sed eros tellus, tincidunt nec faucibus a, mollis nec nibh. Duis interdum, est at fermentum mattis, nibh nulla molestie magna, sed vulputate augue lacus eu metus. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nam tincidunt nulla non quam sodales ac dignissim libero condimentum. Nulla odio ipsum, laoreet sed dapibus et, commodo in mauris. Donec venenatis dapibus hendrerit. Integer at massa tellus. Suspendisse potenti. Integer facilisis risus sit amet ligula vestibulum mollis. Nulla facilisi. Pellentesque tristique ornare turpis, ut pulvinar est laoreet luctus. Nullam arcu purus, suscipit in sagittis sed, elementum ac diam. Morbi diam lacus, tincidunt vel molestie in, dictum posuere libero.
</p>
</div></div>
<div id="side">
<h2>Newest Clients</h2>
<div class="images">
<img src="images/rappers.png" width="100%" />
<img src="images/charity.png" width="100%" />
<img src="images/weddings.png" width="100%" />
</div>
</div>
</body>
</html>
i have 2 pictures, one is how i want it to look(how it looks on 1680 x 1050) and the second one is how it looks on 1024 x 768. Please help me to get the triangles to align correctly in all resolutions.. I have eveything else fitting and resizeing i just cant fix the triangles to make it look 3d.