Jump to content

How Do I Ensure My Webpage Looks The Same With Different Users Screen Size/resolution?


Recommended Posts

I think I am ready to roll out the first version of my site. I looked at my site on three different computers in my house and they all chose to format my web content differently. I am using a margin float command to place three table sidebyside but when I open up my site on other computers (not the one i made my site on) it formats it differently. How do I ensure that my site automatically sizes its ouput to keep the site looking the same always on every computer?

  • Like 1
Link to post
Share on other sites

There's not one single rule or technique to do it. As you go putting together your site, go comparing in different browsers to see what's going on. Make sure that you set default values, because different browser give different default margins, padding and sizes to the elements, like lists, headings, paragraphs and the <body> element itself. Search on Google to learn some CSS layout techniques. Try to find which are the major differences between browsers.

Link to post
Share on other sites
  • 2 weeks later...

I've got the same problem aswell! It is really pissing me off, because in my background, I made this grey "box" which my buttons on the site would appear in, however on any other size of screen/browser, they are not alligned inside the box. I don't know why exactly, but if you know how to fix this, please let me know :-)Another thing that is bothering me is that if I resize my browser, my buttons, images and so on will move aswell.

Edited by JannikL
Link to post
Share on other sites

Well well, I changed the layout and it seems like that worked - however I encountered a new problem. I want this "bottomline" ( I don't know what else to call it ) on my page, which has some text in it. This is how I did it:

<div align="bottom" style="background:url(bottomline.png) repeat"> <p><font size="3" face="arial" color="black"><br><br>Administratore på denne side er ikke ansvarlige for tastefejl.<br><br><br></font></p></div>

However the thing is that the background in the div doesn't fill out the whole page - is that because I am making a div, which won't fill out the entire page, or is there anything wrong with my code?Screenshot of the problem: screenshotdzm.png

Link to post
Share on other sites

Since no one else responded yet I will ask you another question - What are you trying to accomplish? If you want the gray to be the entire background then why dont you just set the grey as the background? You can also specify the size of the div "box" the elements are contained in. I used the following code to make a div "box" with blue background and black border that houses a couple buttons... You can adjust the width and height shown in the code. If this is not what you want then you will have to explain it a little better. <div style="background:blue; width:1106px; height:95px; border: 1px solid black;">

Link to post
Share on other sites

I am trying to make this grey bottom line on every page (Not the whole background, but only like a bottom line), where is has some text - The thing is, that around the sides of the grey box, you can see the background - I want that line to fill out the whole page in width, but not in height (the height it got right now is good)How do I made it wider?

Link to post
Share on other sites

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.

Guest
Reply to this topic...

×   Pasted as rich text.   Paste as plain text instead

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.

Loading...
×
×
  • Create New...