Well... You can't the way you have things set up.
When you pull a page into an iframe, you lose the background definition of the page shown in the iframe. So the fact that you have a lovely background on that blog page is lost when you pull it into the iframe.
So you have a choice....where do you want your lovely background to be seen?
- Directly on the blog site? Then leave things as they are and decorate your iframe page with border,etc. But your background image will continue to show under the content of the iframe.
- Or around and through the iframe? In this case you will have to adjust your codes and where you have your background. And the blog page will be totally plain, no background to direct visitors.
If you choose the second option, this is how you go about it. Note that I have not tried this specifically with a blogspot site but since you can control the background image of that page you should not have a problem!
You have 2 pages you must work with to create an iframe.
1) page with the iframe TrivaniBlog.htm .
This page would have the iframe code calling in your blog.
The iframe code would have transparency section in the code: ALLOWTRANSPARENCY=TRUE
This page would need the floral background! You currently have none on this page. Put your style code pulling in the photobucket image on THIS page, not the blog.
2) your content page (your blog).
This page would have the 2nd part of the transparency code, which would allow your floral on the iframe page to show through the blog.
You would put this into the blog page:
<style type="text/css"> body {background-color: transparent} </style>
This page would have no background decoration of its own and if you visit the page directly it would be plain white.
But if you see it through the iframe you would see the floral.
(I edited your post to remove direct links to your pages.)