Great code, broken website

[fridgefreezer]

Bit of a picky one as I know Mark is a far better coder than I'll ever be, but it is a bit disconcerting that the uTasker website never seems to work properly 

Side menu doesn't scroll, main page doesn't fit my laptop screen, and if I scroll it this happens...

[mark]

Hi

Which browser are you using?

I test with Firefox, IE, Chrome and have never seen this effect.

However it is correct that the menu list on the left hand side doesn't scroll (up and down) - this wasn't designed for use with small screens (eg. netbooks) and I could imagine that it may cause problems on mobile phones etc.

But, wait.. I just tried with a small screen size and now see what you mean about scrolling (you mean scrolling left and right) and then I do see the effect. I'll have a look at what can be done, but can't promise anything just yet. I haven't actually heard of this before since laptops tend to have large screens nowadays and probably that is why I never noticed it after several years of use - also I also have limited web design experience and so don't want to break anything else in the process...;-)

Regards

Mark

[fridgefreezer]

Mark - I'm a luddite and actually develop on a Panasonic CF-18 toughbook, which will probably result in me being burned at the stake by proper coders with triple 20" TFT's... I'm using FireFox 5.0, screen is 1024x768 so probably on a par with netbooks.

It's an unfortunate truth that sometimes with super-compliant modern HTML, old fashioned (and deprecated) tables are still the best way to make a layout that works reliably. My webdev friend really hates it when I point this out to him as he wrestles with DIVs

It's also unfair of me to remind him that the "design it for 800x600 VGA and a 14.4 modem" mantra has come back round to being entirely reasonable given the number of iPads/phones & netbooks out there now.

[mark]

Hi

I have taken a quick look at all pages on the web site using a small(-ish) screen view. It seems as though the problem with scrolling left-right only takes place on the start page: Due to the the initial image plus some announcements to the right of it.

The side menu on the left is specially designed to not scroll. It is made of a background image with the attribute "background-attachment:fixed;" plus some little clickable <div> fields with absolute locations. I liked this since the navigation is always fixed in a complete page, whereas usually it is necessary to scroll back to the top to get to the buttons. It is unconventional maybe but I didn't want to necessarily have a standard looking web site - as well as the fact that I didn't want the OpenSource type looking web site either. Also I think that it works well with the forum.

The drawback is that, if the screen is not high enough, not all buttons are visible. As a quick workaround I have added a new navigation button (as upmost - and only on the start page for the moment) which allows anyone with a small portable device who doesn't see all buttons to open a new window with just navigation buttons (not so high).

After checking the start mage in more detail I realised that it is fact a table that is causing the left-right scroll bar to be activated very early. I made tha table less wide but couldn't get it as small as I wanted (probably some CSS sheets somewhere overwriting what I wanted). So I simply made sure that the NEW entries on the right of the image use some line returns so that they don't want to use up more width.
The result is that the left-right scroll bar appears later (when the screen size is reduced more). When it appears, it is due to the table and not yet the content, so, even though it appears it probably doesn't mean that it will need to be used to see anything (apart from on much smaller screens). The effect is still present when the left-right scroll bar is used but, since it will hardly be needed to be used, shouldn't actually disturb anymore.

Is this acceptable?

Regards

Mark

[fridgefreezer]

Hi Mark,
I can't see any change at the moment, did you make the changes live?

When I do web stuff I try to keep as much as possible free to sort itself out, I avoid using things like fixed sizes & absolute measurements as far as possible as everyone's display is different.

[mark]

Hi

If you refresh the page it will overwrite the cache - it has certainly been switched live.

The only part of the web pages that are critical seem to be this one table that I used to put an image and some news on one line. I tried making the image smaller but it loses quality and I think that it is best to have the image and news on one line (otherwise one seems to have priority and distracts from the other), which makes the width a bit critical. Hope it fits now though.

Regards

Mark

[fridgefreezer]

Looks good Mark!