The "Freeola Customer Forum" forum, which includes Retro Game Reviews, has been archived and is now read-only. You cannot post here or create a new thread or review on this forum.
Hello there, I've been reading up on a few tutorials on CSS (thanks Tyla), and I find it excellent that there is so much you can use to syle a website.
Anyway, i've realised something thats quite a serious issue concerning my website, and people viewing it in different resolutions. You see, my website is made under 1280 x 1024, but if someone with a 1024 x 768 resolution or below try's to view it, its all messed up.
How is it possible to ensure my website looks alright under all resolutions?
djh-world.com
(Yes its rubbish, I know)
Anyway, i've realised something thats quite a serious issue concerning my website, and people viewing it in different resolutions. You see, my website is made under 1280 x 1024, but if someone with a 1024 x 768 resolution or below try's to view it, its all messed up.
How is it possible to ensure my website looks alright under all resolutions?
djh-world.com
(Yes its rubbish, I know)
Page:
Tyla wrote:
> Firstly? Why the hell 1280x1024?
Its the resolution I run my monitor under, anything lower then that is horrible in my books. But I suppose if its the standard....
> Try using the transitional DTD instead.
What does DTD mean?
It was meant to look like this aswell: -
[URL]http://djh-world.com/images/djhworld.png[/URL]
Hmmm, I think this positioning thing needs more research, it's more complex then what I originally thought.
And why is the "header" area so difficult to congfigure?
Thanks for the help so far :)
> Firstly? Why the hell 1280x1024?
Its the resolution I run my monitor under, anything lower then that is horrible in my books. But I suppose if its the standard....
> Try using the transitional DTD instead.
What does DTD mean?
It was meant to look like this aswell: -
[URL]http://djh-world.com/images/djhworld.png[/URL]
Hmmm, I think this positioning thing needs more research, it's more complex then what I originally thought.
And why is the "header" area so difficult to congfigure?
Thanks for the help so far :)
Tyla wrote:
> phi11ip wrote:
> It's more of the fact that Mozilla does one thing while IE does
> another and then I get annoyed and start crying.
>
> Welcome to the world of cross browser CSS support! FWIW, Moz is the
> most compliant so get it to work in Moz first then worry about IE
But more people use IE at the moment. Most things that look perfect in Mozilla don't look very good in IE.
Most things that look perfect in IE look, well, don't even work in Mozilla!
It's just a sod at the moment. If you're making a site with a fixed size of say 760 width then it's far easier than making a site that varies in size. That's why I had problems.
> phi11ip wrote:
> It's more of the fact that Mozilla does one thing while IE does
> another and then I get annoyed and start crying.
>
> Welcome to the world of cross browser CSS support! FWIW, Moz is the
> most compliant so get it to work in Moz first then worry about IE
But more people use IE at the moment. Most things that look perfect in Mozilla don't look very good in IE.
Most things that look perfect in IE look, well, don't even work in Mozilla!
It's just a sod at the moment. If you're making a site with a fixed size of say 760 width then it's far easier than making a site that varies in size. That's why I had problems.
phi11ip wrote:
> It's more of the fact that Mozilla does one thing while IE does
> another and then I get annoyed and start crying.
Welcome to the world of cross browser CSS support! FWIW, Moz is the most compliant so get it to work in Moz first then worry about IE
> It's more of the fact that Mozilla does one thing while IE does
> another and then I get annoyed and start crying.
Welcome to the world of cross browser CSS support! FWIW, Moz is the most compliant so get it to work in Moz first then worry about IE
Your best bet is to state hights and widths as percentages, which means the browsers will automatically resize it to fit the page.
Also, what the site looks like in Mozilla:
http://stevesmiscellany.t35.com/GIF/djhworldmozilla.gif
S.A.
Also, what the site looks like in Mozilla:
http://stevesmiscellany.t35.com/GIF/djhworldmozilla.gif
S.A.
It's more of the fact that Mozilla does one thing while IE does another and then I get annoyed and start crying.
So I used a table and linked it to a stylesheet to make it look good.
In fact, saying that, it's a div at the top, a div at the bottom and a table stuck in the middle.
So I used a table and linked it to a stylesheet to make it look good.
In fact, saying that, it's a div at the top, a div at the bottom and a table stuck in the middle.
phi11ip wrote:
> I found that making the entire thing
> using CSS caused loads of stupid problems.
'Tis a walk in the park once you get the hang of it.
It's all about context. If you require a table, say for a playlist, the obviously a table is the right tool. If you only worrying about layout, then CSS is the tool.
Sometimes you have no option but to use a table for layout due to cr@ppy legacy browsers but with currentl browsers and resources CSS layouts are easy to acheive once you have the hang of it.
> I found that making the entire thing
> using CSS caused loads of stupid problems.
'Tis a walk in the park once you get the hang of it.
It's all about context. If you require a table, say for a playlist, the obviously a table is the right tool. If you only worrying about layout, then CSS is the tool.
Sometimes you have no option but to use a table for layout due to cr@ppy legacy browsers but with currentl browsers and resources CSS layouts are easy to acheive once you have the hang of it.
gamezfreak wrote:
> Hello there, I've been reading up on a few tutorials on CSS (thanks
> Tyla), and I find it excellent that there is so much you can use to
> syle a website.
>
> Anyway, i've realised something thats quite a serious issue
> concerning my website, and people viewing it in different
> resolutions. You see, my website is made under 1280 x 1024, but if
> someone with a 1024 x 768 resolution or below try's to view it, its
> all messed up.
>
> How is it possible to ensure my website looks alright under all
> resolutions?
>
> djh-world.com
>
> (Yes its rubbish, I know)
Firstly? Why the hell 1280x1024? The most commonly used resolution is evenly split between 800x600 and 1024x768 atm!
Your problem is your widths. Your using fixed (px) instead of fluid (%), example:
#main-content {
background-color: #FFFFFF;
border-bottom: 1px #000000 solid;
border-left: 1px #000000 solid;
border-right: 1px #000000 solid;
margin-left: 180px;
margin-right: 180px;
margin-top: 0px;
padding: 20px;
width: 866px;
}
could be:
*please not the COULD as opposed to SHOULD!
#main-content {
background-color: #fff;
border: 1px #000 solid;
border-top: none;
margin: 0 10% 0 10%;
padding: 20px;
width: 80%;
}
Your width should be about 70%.
Your margin:left & margin:right is bad coding. Ovbiously you've used this to center this to the page. Try introducing a container
> Hello there, I've been reading up on a few tutorials on CSS (thanks
> Tyla), and I find it excellent that there is so much you can use to
> syle a website.
>
> Anyway, i've realised something thats quite a serious issue
> concerning my website, and people viewing it in different
> resolutions. You see, my website is made under 1280 x 1024, but if
> someone with a 1024 x 768 resolution or below try's to view it, its
> all messed up.
>
> How is it possible to ensure my website looks alright under all
> resolutions?
>
> djh-world.com
>
> (Yes its rubbish, I know)
Firstly? Why the hell 1280x1024? The most commonly used resolution is evenly split between 800x600 and 1024x768 atm!
Your problem is your widths. Your using fixed (px) instead of fluid (%), example:
#main-content {
background-color: #FFFFFF;
border-bottom: 1px #000000 solid;
border-left: 1px #000000 solid;
border-right: 1px #000000 solid;
margin-left: 180px;
margin-right: 180px;
margin-top: 0px;
padding: 20px;
width: 866px;
}
could be:
*please not the COULD as opposed to SHOULD!
#main-content {
background-color: #fff;
border: 1px #000 solid;
border-top: none;
margin: 0 10% 0 10%;
padding: 20px;
width: 80%;
}
Your width should be about 70%.
Your margin:left & margin:right is bad coding. Ovbiously you've used this to center this to the page. Try introducing a container
around the whole page like:
#container {
text-align:center;
width:100%;
height: 100%;
}
You'll also need to add:
html>body {
height: 100%
}
This tells the page that it's 100% the height of the available browser window.
Your getting there, but stick to relative sizes, use lowercase colour values for your hex, though you can also use RGB!;) Look at your positioning, the nesting is all over the place. You could simplify this a lot by nesting and using more relative possitioning of your div's.
Your also using an xHTML strict DTD! You'll make life really difficult for yourself especially as you need to be able to code in accurate, 100% correct xHTML and code structure, currently it fails all validation. Try using the transitional DTD instead.
Your CSS file however only has one error! No # on the body colour value. You have dedede instead of #dedede.
#container {
text-align:center;
width:100%;
height: 100%;
}
You'll also need to add:
html>body {
height: 100%
}
This tells the page that it's 100% the height of the available browser window.
Your getting there, but stick to relative sizes, use lowercase colour values for your hex, though you can also use RGB!;) Look at your positioning, the nesting is all over the place. You could simplify this a lot by nesting and using more relative possitioning of your div's.
Your also using an xHTML strict DTD! You'll make life really difficult for yourself especially as you need to be able to code in accurate, 100% correct xHTML and code structure, currently it fails all validation. Try using the transitional DTD instead.
Your CSS file however only has one error! No # on the body colour value. You have dedede instead of #dedede.
It looks fine on a 1400x1050 resolution!
800x600 however looks bad.
You shouldn't set absolute widths for boxes unless the width it for an 800x600 resolution style site (like here), you should try and let the site expand by defining the sizes using percentages.
My site looks fine when viewed on 800x600 and expands with the browser (It has a max size too when using Mozilla.) I used percentages to define it so it works with all sizes.
CSS isn't as easy to use as laying your site out using a table, that's why mine's got a mixture. I found that making the entire thing using CSS caused loads of stupid problems.
800x600 however looks bad.
You shouldn't set absolute widths for boxes unless the width it for an 800x600 resolution style site (like here), you should try and let the site expand by defining the sizes using percentages.
My site looks fine when viewed on 800x600 and expands with the browser (It has a max size too when using Mozilla.) I used percentages to define it so it works with all sizes.
CSS isn't as easy to use as laying your site out using a table, that's why mine's got a mixture. I found that making the entire thing using CSS caused loads of stupid problems.
Hello there, I've been reading up on a few tutorials on CSS (thanks Tyla), and I find it excellent that there is so much you can use to syle a website.
Anyway, i've realised something thats quite a serious issue concerning my website, and people viewing it in different resolutions. You see, my website is made under 1280 x 1024, but if someone with a 1024 x 768 resolution or below try's to view it, its all messed up.
How is it possible to ensure my website looks alright under all resolutions?
djh-world.com
(Yes its rubbish, I know)
Anyway, i've realised something thats quite a serious issue concerning my website, and people viewing it in different resolutions. You see, my website is made under 1280 x 1024, but if someone with a 1024 x 768 resolution or below try's to view it, its all messed up.
How is it possible to ensure my website looks alright under all resolutions?
djh-world.com
(Yes its rubbish, I know)
Page:
Freeola & GetDotted are rated 5 Stars
Check out some of our customer reviews below:
First Class!
I feel that your service on this occasion was absolutely first class - a model of excellence. After this, I hope to stay with Freeola for a long time!
Best Provider
The best provider I know of, never a problem, recommend highly
It appears you are using an old browser, as such, some parts of the Freeola and Getdotted site will not work as intended. Using the latest version of your browser, or another browser such as Google Chrome, Mozilla Firefox, or Opera will provide a better, safer browsing experience for you.