Welcome to Dream.In.Code
Getting Help is Easy!

Join 86,245 Programmers. There are 2,256 online right now! Ask your question and get quick answers from Dream.In.Code experts. Join the #1 programming help community on the internet! Registration is fast and FREE... Join Now!

Chat LIVE With a Expert
Powered by LivePerson.com

Register to Make This Box Go Away!

design a web that fit to any screen resolution

 
Reply to this topicStart new topic

design a web that fit to any screen resolution

prasadi
post 9 Apr, 2008 - 01:55 AM
Post #1


New D.I.C Head

*
Joined: 9 Apr, 2008
Posts: 3



I want to know how to Design a web that fit to any screen resolution.
Thanks.

This post has been edited by PsychoCoder: 19 Apr, 2008 - 11:26 PM
User is offlineProfile CardPM
Go to the top of the page
+Quote Post


no2pencil
post 9 Apr, 2008 - 02:03 AM
Post #2


DIC K-mart

Group Icon
Joined: 10 May, 2007
Posts: 3,321

This can't be done with pure html, it would need something that works dynamically on the clients (browser) side, like JavaScript or VBScript.

Or a surefire way is to have them pick, which I'm sure is not what you want.

The nice thing is, most people own monitors that can do 1024x768.
User is offlineProfile CardPM
Go to the top of the page
+Quote Post

ecdysis
post 19 Apr, 2008 - 10:56 PM
Post #3


New D.I.C Head

*
Joined: 17 Apr, 2008
Posts: 6

Hi prasadi, I recently saw this tutorial about fluid page designs, it may help a bit:
http://tutorials.alsacreations.com/fluide/
User is offlineProfile CardPM
Go to the top of the page
+Quote Post

baavgai
post 20 Apr, 2008 - 03:18 AM
Post #4


Dreaming Coder

Group Icon
Joined: 16 Oct, 2007
Posts: 1,077

Be relative. Express everything in terms of percentage, "em", etc. This works as long as you're willing to accept that the client controls the look and feel of the page.

The minute you want everything to look a very particular way, you loose. Such sites will look best on the client that designed them and everyone else who is close to that client's specs. I have a portable device that surfs fine, but only supports 800x600. You find out real quick who your friends are.
User is online!Profile CardPM
Go to the top of the page
+Quote Post

prasadi
post 20 Apr, 2008 - 03:28 AM
Post #5


New D.I.C Head

*
Joined: 9 Apr, 2008
Posts: 3

QUOTE(prasadi @ 9 Apr, 2008 - 01:55 AM) *

I want to know how to Design a web that fit to any screen resolution.
Thanks.



[font=Verdana][b] smile.gif Thanks lot....

QUOTE(prasadi @ 9 Apr, 2008 - 01:55 AM) *

I want to know how to Design a web that fit to any screen resolution.
Thanks.



Thanks lot.... smile.gif smile.gif smile.gif

QUOTE(ecdysis @ 19 Apr, 2008 - 10:56 PM) *

Hi prasadi, I recently saw this tutorial about fluid page designs, it may help a bit:
http://tutorials.alsacreations.com/fluide/


icon_up.gif icon_up.gif icon_up.gif
Thanks lot.... smile.gif smile.gif smile.gif

QUOTE(baavgai @ 20 Apr, 2008 - 03:18 AM) *

Be relative. Express everything in terms of percentage, "em", etc. This works as long as you're willing to accept that the client controls the look and feel of the page.

The minute you want everything to look a very particular way, you loose. Such sites will look best on the client that designed them and everyone else who is close to that client's specs. I have a portable device that surfs fine, but only supports 800x600. You find out real quick who your friends are.


icon_up.gif icon_up.gif icon_up.gif
Thanks lot.... smile.gif smile.gif smile.gif

QUOTE(no2pencil @ 9 Apr, 2008 - 02:03 AM) *

This can't be done with pure html, it would need something that works dynamically on the clients (browser) side, like JavaScript or VBScript.

Or a surefire way is to have them pick, which I'm sure is not what you want.

The nice thing is, most people own monitors that can do 1024x768.


icon_up.gif icon_up.gif icon_up.gif
Thanks lot.... smile.gif smile.gif smile.gif
User is offlineProfile CardPM
Go to the top of the page
+Quote Post

Sandi
post 20 Apr, 2008 - 06:48 PM
Post #6


New D.I.C Head

*
Joined: 18 Nov, 2007
Posts: 11

In CSS define a wrapper for your entire web page. For instance if you want to fill 90 percent of the width with a 20px margin top and bottom:

CODE
#wrapper {
    padding: 0;
    margin: 20px auto 20px auto;
    width 90%;
}


Or a webpage with a 5 percent border.

CODE
#wrapper {
    padding: 0;
    margin: 5%;
    width: auto;
}

Either way give you a fluid page that looks similar in different screen resolutions.
User is offlineProfile CardPM
Go to the top of the page
+Quote Post

prasadi
post 21 Apr, 2008 - 10:30 PM
Post #7


New D.I.C Head

*
Joined: 9 Apr, 2008
Posts: 3

QUOTE(ecdysis @ 19 Apr, 2008 - 10:56 PM) *

Hi prasadi, I recently saw this tutorial about fluid page designs, it may help a bit:
http://tutorials.alsacreations.com/fluide/




-------------------------------------------------------------------
actually I have tried that 100% concept several times..
but it wouldn't worked.
I have done it using DIV. and all DIV's has background images itself.




actually I have tried that 100% concept several times..
but it wouldn't worked.
I have done it using DIV. and all DIV's has background images itself.


Thanks.. smile.gif
User is offlineProfile CardPM
Go to the top of the page
+Quote Post

Fast ReplyReply to this topicStart new topic
Time is now: 5/16/08 08:34AM

Live Help!

Tutorials

Programming

Web Development

Reference Sheets

Code Snippets

Bye Bye Ads

Free DIC T-Shirt

T-Shirt Example

Related Sites

Monthly Drawing

Thumb Drive

Partners

Top Contributors

Top 10 Kudos This Month