How to make an element display above a dynamic content? Pls, help.

wood_flower · Jul 31, 2005

Hello everybody,

First of all, please take a look at the image i attached in this post.

Basically, it is a static website. The only thing is that the picture of the sun needs to be changable with each reload of the site. I would like to use that area to have a rotating set of pictures and can also be used as an advertisement area.

But as the sun image there is not a rectangle image but a trapezium so i still don`t know how to make it changable. Is there anyway to make it rectangular in HTML template then have an element overlapping it so the trapezium shape will be in front of the rectangle like you can do with layers in Photoshop for instance?

Please help me. Thank you very much for your support.

Rowan W · Jul 31, 2005

Say if the whole row was a table cell, you could make the left image a transparent gif/png and align it to the left side of the cell. Then all you have to do is give the cell a background image (such as the sunset) so it appears behind the transparent image on the left.

Do you know what I mean by this?

wood_flower · Jul 31, 2005

Rowan W said:
Say if the whole row was a table cell, you could make the left image a transparent gif/png and align it to the left side of the cell. Then all you have to do is give the cell a background image (such as the sunset) so it appears behind the transparent image on the left.

Do you know what I mean by this?

Does your recommendation look like below?

Code:

<table background="sun-set-image"><tr>
<td background="transparent-image" style="background-position: top left; background-repeat: no-repeat">some-code-here</td>
</tr></table>

Thank you very much for your support.

Rowan W · Jul 31, 2005

That may work, but I would use something like this:

Code:

<style type="text/css">
<!--
.header {
	width:760px;
	height:120px;
	background-image:url(sunset.jpg);
	background-position:right;
	background-repeat:no-repeat;
-->
</style>
</head>

<body>

<table cellpadding="0" cellspacing="0">
	<tr>
		<td class="header"><img src="transparent_image.png" align="left">
		</td>
	</tr>
</table>

or:

Code:

<table cellpadding="0" cellspacing="0">
	<tr>
		<td background="sunset.jpg"><img src="transparent_image.png" align="left">
		</td>
	</tr>
</table>

wood_flower · Aug 1, 2005

Thank you very much. It works sooooooooooo good.

Rowan W · Aug 1, 2005

Excellent. :hehe:

How to make an element display above a dynamic content? Pls, help.

New Member

Established Member

New Member

Established Member

New Member

Established Member

Similar threads

We're social

NurCoin.com

Banklessinvestments.xyz

Confab.net

TakeCoupons.com

Medicare4All.com

WolfLA.Com

crossfithome.com

4dprintservice.com

MyAffordableHealth.com

firedboiler.com

Pinned

Appreciation

Agreement

Answers

Relevance

Reaction

Status

Feeling