Mine html (css inside) code looks like this:
<body style="color: #25670c; margin: 0 0 0 0; padding: 0 0 0 0; font-family : Times New Roman; font-size : 14px; text-align: center;">
<div style="height: 96px; width: 985px;"><a href="www.one.lt">
<img border="0" src="images/graphic/header.png" width="985" height="96" alt="header" title="DigiSpot eBay store" /></a></div>
<div style="height: 41px; width: 985px;">
<img border="0" src="/images/graphic/meniu.png" alt="DigiSpot meniu" width="985" height="41" usemap="#mapas" />
<map name="mapas">
<area shape="rect" coords="56,0,0,41" href="www.one.lt" alt="DigiSpot eBay store home" title="DigiSpot eBay store home">
<area shape="rect" coords="539,0,400,41" href="www.one.lt" alt="About Digispot" title="About DigiSpot">
<area shape="rect" coords="699,0,539,41" href="www.one.lt" alt="Delivery information" title="Delivery information">
<area shape="rect" coords="845,0,699,41" href="www.one.lt" alt="Returns information" title="Returns information">
<area shape="rect" coords="985,0,845,41" href="www.one.lt" alt="Contacts information" title="Contacts information">
</map> </div>
<div style="position:relative">
<div style="float:left; width: 663px; height:100px; text-align: center; background-color:#d6d6a4;"><img border="0" src="/images/graphic/description.png" width="232" height="81"><br /><div style="text-align: left; margin-left: 10;">[[Description]]</div></div>
<div style="float:left; width: 324px; height:100px; text-align: center; ">
<div style="width: 324px; color: #ffffff; background-color:#6b8861; font-size : 34px;">[[Title]]</div>
<div style="width: 324px; color: #ffffff; background-color:#6b8861;"><div style="width: 320px; margin: 2 2 2 2; background-color:#ffffff;">[[Picture1]]</div><div style="width: 300px; height: 2px; background-color:#6b8861; color: #6b8861;"></div></div>
<div style="width: 324px; color: #801010; font-size : 40px; background-color:#d6d6a4;">Price: [[BuyItNowPrice]]</div>
</div>
</div>
<div style="clear: both; text-align: center; width:985px; margin: 0 auto;"><img border="0" src="graphic/buttom.png" width="524" height="42"></div>
</body>
The result is not as I wish and looks like this:

Bigger image on push here
Here is stroked problematic areas:

Bigger image on push here
- I want to all this page would be aligned to center, I used in body text align, but its not helping.
- The div in the right should be in center of page bottom, I dont know why he choosing such position and some part of the image is under “Price” div.
- Is it posible to do that description div in left and in right price and other info div would always have same height which is not fixed, because I want to have that background of those div’s not separated in bottom.
edit: push images to make them bigger.
See this demo:
http://jsbin.com/uhakak/7/edit
First, you should wrap all your content into some div which will make it in center:
and css for it:
That way you will put everything in center of a page. text-align:center works for text only (inline elements, actually text is just a separate case of inline elements). Divs are block elements and text-align:center will not affect them.
Second. Not sure why you have that div on the right side, but try to add overflow hidden to your div with
postion:relativewhich holds description, title and price. I see no problem with it.Third, that is little tricky to make both divs have the same height, but as your point is simple background color, you may set background for parent div. That with overflow:hidden (actually, as I can see position:relative is not needed there at all). Demo above should show how it works. I’ve removed height:100px; there