LP Layout problem

Status
Not open for further replies.
HarveyJ

HarveyJ

He is - THE CACTUS!
Feb 25, 2008
3,879
48
0
Melbourne - Not the one in Florida
www.affiliationcash.com
OK, so web dev is REALLY not my thing, but I want to learn, so I thought I'd try to make an LP without using a generator.
I've found a template I like, and I've stripped away the bloat code.

So, my problem:
Currently, I'm trying to make a header image that will rescale horizontally, so that it takes up a certain percentage of horizontal space, so that it doesn't screw up the look when I embed an offsite submit in an <iframe>.

Now, I'll admit to knowing nearly fuck all about how this is done.
I thought of using a table, with percentage and * values.
If anyone wants to have a look at code, I'll post it.

No, I don't have direct code to embed instead of using an iframe. I'm running this off a 3rd party, and this is the first time I'm not just forwarding the a-record to their LP. Likewise, I don't want to send them offsite, as that may tweak some people onto it being a 3rd party.

Is this sort of horizontal rescaling even possible?
Can anyone can help me out here?
It'd be really appreciated.
 


Thanks tweak


<body>
<center>
<table cellpadding="0" cellspacing="0">
<tr>
<td width="5%"></td>
<td align="right"><img src="English_ezg_logo_01.png" /></td>
<td width="*" class="stretch"> </td>
<td align="left"><img src="English_ezg_logo_03.png" /></td>
<td width="5%"> </td>
</tr>
</table>
</center>
</body>

With stretch class defined in the CSS as:
.stretch { background: url("English_ezg_logo_02.png") repeat-y; }

If you PM me your email address, I can send you the files.
 
It's been a while since i've played around with web design, but from what I can remember I never used tables at all. I used div tags and css to make the layout.

Sorry I can't be of any real help.
 
HarveyJ said:
Thanks tweak


<body>
<center>
<table cellpadding="0" cellspacing="0">
<tr>
<td width="5%"></td>
<td align="right"><img src="English_ezg_logo_01.png" /></td>
<td width="*" class="stretch"> </td>
<td align="left"><img src="English_ezg_logo_03.png" /></td>
<td width="5%"> </td>
</tr>
</table>
</center>
</body>

With stretch class defined in the CSS as:
.stretch { background: url("English_ezg_logo_02.png") repeat-y; }

If you PM me your email address, I can send you the files.
Click to expand...

Pm sent.
 
I don't think resizing the TD with any type of attribute will cause the image to rescale. Plus, if you rescale the image, it will distort unless you maintain the aspect ratio. You could make it a background image but then the table cell might clip it.

You can force it's size like this

<img height="in pixels" width="in pixels" src="path to image" />


Also, when rescaling, you will get the least distortion by using pixels that are not 'oddball' percentages of the original image. ie 100%, 50%,25%.

PM me if you need some help. I do this for a living.
 
Distortion's not a problem in this case. The image is only 1px wide, and designed to be rescaled horizontally.

I've done a bit of reading overnight and found that I can make it fill the background of a designated area with y-pos:repeat in the CSS, but I still don't know how to dynamically scale the actual horizontal value of the table.

I suppose the easiest thing to do would be to just hard code it specifically for that one page, huh?
I can't believe it... I seriously did not think of that until I typed it just now *slaps head*


Well, if it works that way, then thanks for the help guys. I actually wouldn't have thought of it without being able to bounce ideas off a few of you.
 
HarveyJ said:
Distortion's not a problem in this case. The image is only 1px wide, and designed to be rescaled horizontally.

I've done a bit of reading overnight and found that I can make it fill the background of a designated area with y-pos:repeat in the CSS, but I still don't know how to dynamically scale the actual horizontal value of the table.

I suppose the easiest thing to do would be to just hard code it specifically for that one page, huh?
I can't believe it... I seriously did not think of that until I typed it just now *slaps head*


Well, if it works that way, then thanks for the help guys. I actually wouldn't have thought of it without being able to bounce ideas off a few of you.
Click to expand...

haha nice. If you still want me to take a look and set it up dynamically I will, I just need to know what percentage of the screen you wan the header to take up.
 
Tweak, thanks for the help mate.
I emailed you the basics on it.
I'm wanting it to maybe take up 75-80% of the horizontal space.

I figure after I see how you've done it, I'll be able to emulate it later and not have to bother people until my next n00bish idealism takes over and I try to do something else I haven't done before heheh
 
You also know that in this day and age, using tables for layout purposes is kinda frowned upon in the industry. If you want a quick layout, look at Yahoo's Gui Libraries. Of course, it would take a bit of studying but they have done a bunch of the CSS work for ya. :) And they are cross-browser compliant across the 'Big 2'. IE and FF.
 
Status
Not open for further replies.
Top Bottom