/    Sign up×
Community /Pin to ProfileBookmark

CSS Screen Resolution Problem

Copy linkTweet thisAlerts:
Aug 11.2004

While i was making my website i had my computer in 1024×768 resolution. Which is fine but now when i look at my webpage in a smaller resolution 800×600 the page is too big for the screen. So alot of info gets cut off and u need to use a scroll bar and manually scroll over to see it. I was told i needed to set up a css style sheet to correct this and was sent to this website [URL=http://www.vladdy.net/Demos/ElementSizing.html]www.vladdy.net/Demos/ElementSizing.html[/URL] I’ve never done this before and that tutorial really doesnt explain it well enough for a beginner. Anyone know of a better tutorial or have any info how i can accomplish what i’m looking to get done? thanx for any help.

to post a comment
CSS

9 Comments(s) ↴

Copy linkTweet thisAlerts:
@johndoe190Aug 11.2004 — Ok i cant point you to a tutorial but i can give you some info either set the widths of the page in % so it always takes up only a percentage of the screen. Or go the easier route and make a layout which is no more than 780px in width so it is a fixed width layout.

Hope that helps you.
Copy linkTweet thisAlerts:
@downgradeauthorAug 11.2004 — I think the percentage idea is more of what i'm looking for. How is i start to go about this? thanx again for your help.
Copy linkTweet thisAlerts:
@johndoe190Aug 11.2004 — Well if your using a css based layout then open up your style sheet then change the widths on all of the block level elements to % so for example if the header fills the whole top part of the screen change this to 100% but it is usually recommended to use 98% or 99%
Copy linkTweet thisAlerts:
@Paul_JrAug 11.2004 — [i]Originally posted by sharkey [/i]

[B]for example if the header fills the whole top part of the screen change this to 100% but it is usually recommended to use 98% or 99% [/B][/QUOTE]
Why? Then it won't expand the whole width and there will be a gap. ?
Copy linkTweet thisAlerts:
@johndoe190Aug 11.2004 — I dont know but a while ago i asked this question and multiple users replied saying use 98% or 99% for some odd reason ?
Copy linkTweet thisAlerts:
@downgradeauthorAug 12.2004 — Ok, this is what i have for a style sheet. What do i need to add to this to make it so i can change out the percentages? Thanx again, sorry for being such a beginner....


<STYLE type=text/css>

BODY {

SCROLLBAR-FACE-COLOR: #000000; SCROLLBAR-HIGHLIGHT-COLOR: #000000;

SCROLLBAR-SHADOW-COLOR: #333333; SCROLLBAR-3DLIGHT-COLOR: #2e425a;

SCROLLBAR-ARROW-COLOR: #999999; SCROLLBAR-TRACK-COLOR: #000000;

SCROLLBAR-DARKSHADOW-COLOR: #000000; BACKGROUND-COLOR: #000000

}

A:link {

COLOR: #FFFFFF; TEXT-DECORATION: none

}

A:active {

COLOR: #FFFFFF; TEXT-DECORATION: none

}

A:visited {

COLOR: #FFFFFF; TEXT-DECORATION: none

}

A:hover {

COLOR: #CC0000; TEXT-DECORATION: underline

}

</STYLE>
Copy linkTweet thisAlerts:
@johndoe190Aug 12.2004 — Ok well your not using your style sheet to handle the layout of the site so i take it your using tables which where you have widths in the tables etc instead of leaving them like width="45" change to width="40%" or something but you would be alot better learning how to do css based layouts.
Copy linkTweet thisAlerts:
@toicontienAug 12.2004 — [i]Originally posted by sharkey [/i]

[B]I dont know but a while ago i asked this question and multiple users replied saying use 98% or 99% for some odd reason ? [/B][/QUOTE]
They might have said that because they didn't take out the margin or padding that the body tag adds automatically. Some browsers might goof that up. Other than that, 100% would work just fine.
Copy linkTweet thisAlerts:
@johndoe190Aug 13.2004 — Yeah works fine for me too but it confused me for a hell of a while because what these users said.
×

Success!

Help @downgrade 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.18,
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: @AriseFacilitySolutions09,
tipped: article
amount: 1000 SATS,

tipper: @Yussuf4331,
tipped: article
amount: 1000 SATS,

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