/    Sign up×
Community /Pin to ProfileBookmark

resizing page edges to fit any resolution

Copy linkTweet thisAlerts:
Jul 13.2003

We need to create a page with all of the content centered (in a table), and the borders of the page able to resize, so that no content or formatting is lost when the page is viewed at different resoltions (like this [url]http://collective.valve-erc.com/[/url] )
But, instead of having a solid colour for the page edges (which is easy enough) we want to use an image (on both sides), which will be ‘cut off’ from the outer edges. Is it possible?

Cheers-
Wozza

to post a comment
HTML

2 Comments(s) ↴

Copy linkTweet thisAlerts:
@David_HarrisonJul 13.2003 — You can [B]TRY[/B] this, but remember, there's not a guarantee in sight.

Inside the very first td tag have this:


<img src="xxx.png" style="position:absolute;top:0;left:-imagewidthpx;">

where it says -imagewidth above, put in what it says. So if your image is 100px wide enter -100 so that it looks like this:

<img src="xxx.png" style="position:absolute;top:0;left:-100px;">

Edit: That was for the image on the left, for the image on the right put it also in the first td tag but this time enter the width of the image + the width of the table. In this case 100 + 752 = 852px.

Another Edit: I'm not so sure about the right hand image, I think you may end up with a scroll bar there. What may be better for that one is to make it a background and not start it until it's out of the table (if ya know what I mean). But I can't remember how to do that right now, I'll have to consult my books on that one.
Copy linkTweet thisAlerts:
@kipkreationsJul 13.2003 — the basic concept about web design is making it look good on all pages,

what I usually do, since the lowest resolution people use these days is 800x600, I just make my page 1 table, centered on a page, with the width 750px or 700px.

then put the image on the sides.

or say set the side images as a number in width such as 75px each.. which means youll have 800-75-75=675px left.

then take that 675 on the top bar or the page table and make the table width 100% so it always resizes.

i always make my pages a huge table, with "width=100%" and height="100%", while setting the body tags like so:

body topmargin="0" leftmargin="0" rightmargin="0" bottommargin="0"....

check out my page for examples.
×

Success!

Help @Wozza spread the word by sharing this article on Twitter...

Tweet This
Sign in
Forgot password?
Sign in with TwitchSign in with GithubCreate Account
about: ({
version: 0.1.9 — BETA 5.5,
whats_new: community page,
up_next: more Davinci•003 tasks,
coming_soon: events calendar,
social: @webDeveloperHQ
});

legal: ({
terms: of use,
privacy: policy
});
changelog: (
version: 0.1.9,
notes: added community page

version: 0.1.8,
notes: added Davinci•003

version: 0.1.7,
notes: upvote answers to bounties

version: 0.1.6,
notes: article editor refresh
)...
recent_tips: (
tipper: @Yussuf4331,
tipped: article
amount: 1000 SATS,

tipper: @darkwebsites540,
tipped: article
amount: 10 SATS,

tipper: @Samric24,
tipped: article
amount: 1000 SATS,
)...