Programming Forums > Web Development and Design > Other Web Development Languages

MrMan9879 · Oct 14th, 2005, 12:41 PM

I've been building a website for my mom's synchronized swimming team and I'm trying to show her how to update it herself, and I notice that on her computer everything looks a little bit different, the button sizes are a bit screwy and even on the internet the pages aren't proper like they are on my computer.

I found out that her monitor is best compatible with 1280 by 1024, so that's what it's at, but my old monitor is at 1024 by 762. So, they look different. Is there some way to make it work proper on both sizes?

Polyphemus_ · Oct 14th, 2005, 1:02 PM

the old trick is to make the main table/div have a static width, so something like this:

(Toggle Plain Text)

<table style="width: 800px">

iignotus · Oct 14th, 2005, 3:50 PM

I think the trick is to use percentages, as it will display as the same relative length in each different resolution.

(Toggle Plain Text)

<table style="width: 80%">

And it's 1024x768, not 1024x762. Hope this works.

MrMan9879 · Oct 15th, 2005, 3:57 AM

Quote:

Originally Posted by iignotus

I think the trick is to use percentages, as it will display as the same relative length in each different resolution.

(Toggle Plain Text)

<table style="width: 80%">

And it's 1024x768, not 1024x762. Hope this works.

Yeah, I knew it was 768... just made a mistake. Thanks, I'll try that.

Ooble · Oct 14th, 2005, 6:21 PM

Your web site should conform to any resolution between 800x600 and 1600x1200 as a minimum. That's what relative sizes are for.

java_roshan · Oct 16th, 2005, 9:40 AM

I think using percentage is much better than defining pixels because percentage will dynamically calculate the pixels and accordingly, put the table on the screen, whereas pixels are just predefined.

(Toggle Plain Text)

<table style="width: 80%">

as mentioned in one of the post is the correct solution!

DaWei · Oct 16th, 2005, 10:03 AM

Whether or not one uses fixed dimensions or percentages depends upon how one wants it to react at different resolutions (or different window sizes at the same resolution). Stating hard and fast rules in favor of one or the other is actually doing the questioner a disservice. Some presentations work well with percentages and some don't. One has to analyze the presentation and decide in view of that. Among the alternatives available are different pages for different resolutions, dynamic resizing according to current conditions of the browser, a mix of fixed and dynamic sizing, etc. If the problem were as simple as choosing percentage over fixed-width, or vice-versa, there'd be no arguments and designers wouldn't be bitching.

If you want to see a considered compromise, look no further than the PFO Member's Map.

stevengs · Oct 16th, 2005, 10:26 AM

hehe, I was meaning to ask you about the arrangment of the Map. When viewed with Firefox, it makes sense, but with Microsoft Explorer the fields are in the right place, but the map itself is somewhere a page or two below, out of sight. MS sure doesn't seem to like to play ball by everybody else's rules. Always makin' up house rules

DaWei · Oct 16th, 2005, 11:33 AM

Wow, I had not checked compatibility with IE since about halfway through the project. At that time it worked. The major change I made after that time was when I decided to restrict the map to a 360 degree view at the default zoom level. When I did that, I placed the map div inside a second div and sized the second div to take up all the room left by the location div, while reducing the inside div to fit the map. At that point, IE apparently refused to honor just the "float right" for the info div. I added a "float left" to the outer map div, and that seems to have taken care of the problem.

You may note that the thing doesn't work well in Opera. The API has been modified some since I began, and one of the new things is a "browser compatibility check". There are more details on the Google API site, but the upshot is that I get a "browser not compatible" message when I invoke it with Opera. I'm not going to worry about it, as no one is paying me to, lol.

There is this about IE, for those of you who may be unaware of it: it will behave differently depending upon the level of standardization you ask it to adhere to. In one commercial project I'm working on, I use a lot of switches between visibility:visible display:block and visibility:hidden display:none. Despite DOM specifications, IE will not apply those attributes correctly in all circumstances. I have a browser check for IE Mac and IE Win for several versions, as well as checks for Opera, Konqueror, Mozilla, and Safari. The only one I have to currently perform is for IE under just that one specific circumstance. I have to switch div attributes from "table-row" and "table-cell" to "display block" and "inline" to get an unused row of the cart to disappear entirely, under IE.

Polyphemus_ · Oct 16th, 2005, 12:45 PM

i think the best solution is to make a webpage for 800x600, 1024x768 and a higher resolution, like the microsoft site does.

Oct 14th, 2005, 12:41 PM	#1
MrMan9879 Programmer Join Date: Sep 2005 Location: Nanaimo, BC, Canada Posts: 97 Rep Power: 0	How to make websites work with 1280 by 1024 and 1024 by 762 I've been building a website for my mom's synchronized swimming team and I'm trying to show her how to update it herself, and I notice that on her computer everything looks a little bit different, the button sizes are a bit screwy and even on the internet the pages aren't proper like they are on my computer. I found out that her monitor is best compatible with 1280 by 1024, so that's what it's at, but my old monitor is at 1024 by 762. So, they look different. Is there some way to make it work proper on both sizes?

Oct 14th, 2005, 1:02 PM	#2
Polyphemus_ Expert Programmer Join Date: Aug 2005 Location: Rotterdam, the Netherlands Posts: 942 Rep Power: 4	the old trick is to make the main table/div have a static width, so something like this: (Toggle Plain Text) <table style="width: 800px"> <table style="width: 800px">

Oct 14th, 2005, 3:50 PM	#3
iignotus Professional Programmer Join Date: Apr 2005 Location: Nowhere Special Posts: 466 Rep Power: 4	I think the trick is to use percentages, as it will display as the same relative length in each different resolution. (Toggle Plain Text) <table style="width: 80%"> <table style="width: 80%"> And it's 1024x768, not 1024x762. Hope this works. __________________ (Toggle Plain Text) % rc4 hexkey < input > output #define S ,t=s[i],s[i]=s[j],s[j]=t /* rc4 hexkey <file / unsigned char k[256],s[256],i,j,t;main(c,v,e)charv;{++v;while(++i)s[ i]=i;for(c=0;(v)++;k[c++]=e)sscanf((v)++-1,"%2x",&e);while(j+=s[i] +k[i%c]S,++i);for(j=0;c=~getchar();putchar(~c^s[t+=s[i]]))j+=s[++i]S;}

Oct 14th, 2005, 6:21 PM	#5
Ooble I eat cake for breakfast. Join Date: Jul 2004 Location: In my box. Posts: 4,434 Rep Power: 9	Your web site should conform to any resolution between 800x600 and 1600x1200 as a minimum. That's what relative sizes are for. __________________ Me :: You :: Them

Oct 16th, 2005, 9:40 AM	#6
java_roshan Professional Programmer Join Date: Mar 2005 Location: Student of University of Mumbai, Maharashtra State, India Posts: 344 Rep Power: 4	I think using percentage is much better than defining pixels because percentage will dynamically calculate the pixels and accordingly, put the table on the screen, whereas pixels are just predefined. (Toggle Plain Text) <table style="width: 80%"> <table style="width: 80%"> as mentioned in one of the post is the correct solution! __________________ Visit: http://www.somaiya.edu

Oct 16th, 2005, 10:03 AM	#7
DaWei Resident Grouch Join Date: Jun 2005 Posts: 6,453 Rep Power: 10	Whether or not one uses fixed dimensions or percentages depends upon how one wants it to react at different resolutions (or different window sizes at the same resolution). Stating hard and fast rules in favor of one or the other is actually doing the questioner a disservice. Some presentations work well with percentages and some don't. One has to analyze the presentation and decide in view of that. Among the alternatives available are different pages for different resolutions, dynamic resizing according to current conditions of the browser, a mix of fixed and dynamic sizing, etc. If the problem were as simple as choosing percentage over fixed-width, or vice-versa, there'd be no arguments and designers wouldn't be bitching. If you want to see a considered compromise, look no further than the PFO Member's Map. __________________ Abstraction doesn't make it impossible to write bad code; it makes it possible to write superior code. Contributor's Corner: Grumpy on C++ Exceptions DaWei on Pointers

Oct 16th, 2005, 10:26 AM	#8
stevengs Professional Programmer Join Date: May 2005 Location: Bad Nauheim, Germany Posts: 436 Rep Power: 4	hehe, I was meaning to ask you about the arrangment of the Map. When viewed with Firefox, it makes sense, but with Microsoft Explorer the fields are in the right place, but the map itself is somewhere a page or two below, out of sight. MS sure doesn't seem to like to play ball by everybody else's rules. Always makin' up house rules __________________ -Steven "Is this a piece of your brain?" - Basil Fawlty

Oct 16th, 2005, 11:33 AM	#9
DaWei Resident Grouch Join Date: Jun 2005 Posts: 6,453 Rep Power: 10	Wow, I had not checked compatibility with IE since about halfway through the project. At that time it worked. The major change I made after that time was when I decided to restrict the map to a 360 degree view at the default zoom level. When I did that, I placed the map div inside a second div and sized the second div to take up all the room left by the location div, while reducing the inside div to fit the map. At that point, IE apparently refused to honor just the "float right" for the info div. I added a "float left" to the outer map div, and that seems to have taken care of the problem. You may note that the thing doesn't work well in Opera. The API has been modified some since I began, and one of the new things is a "browser compatibility check". There are more details on the Google API site, but the upshot is that I get a "browser not compatible" message when I invoke it with Opera. I'm not going to worry about it, as no one is paying me to, lol. There is this about IE, for those of you who may be unaware of it: it will behave differently depending upon the level of standardization you ask it to adhere to. In one commercial project I'm working on, I use a lot of switches between visibility:visible display:block and visibility:hidden display:none. Despite DOM specifications, IE will not apply those attributes correctly in all circumstances. I have a browser check for IE Mac and IE Win for several versions, as well as checks for Opera, Konqueror, Mozilla, and Safari. The only one I have to currently perform is for IE under just that one specific circumstance. I have to switch div attributes from "table-row" and "table-cell" to "display block" and "inline" to get an unused row of the cart to disappear entirely, under IE. __________________ Abstraction doesn't make it impossible to write bad code; it makes it possible to write superior code. Contributor's Corner: Grumpy on C++ Exceptions DaWei on Pointers

Oct 16th, 2005, 12:45 PM	#10
Polyphemus_ Expert Programmer Join Date: Aug 2005 Location: Rotterdam, the Netherlands Posts: 942 Rep Power: 4	i think the best solution is to make a webpage for 800x600, 1024x768 and a higher resolution, like the microsoft site does.

Currently Active Users Viewing This Thread: 1 (0 members and 1 guests)

Thread Tools
Show Printable Version Email this Page
Display Modes
Switch to Linear Mode Hybrid Mode Switch to Threaded Mode

Programming Forums > Web Development and Design > Other Web Development Languages

How to make websites work with 1280 by 1024 and 1024 by 762