in my quest to change things, I stuffed something.....

[ace2]

I'm updating/fixing some templates for mobile devices only.
I've some how stuffed the formatting of the menu bar and heading bar on 2 of the pages.

Main page
http://www.users.on.net/~ace2/m-index.htm

Ones that have issues
http://www.users.on.net/~ace2/m-daily.htm
http://www.users.on.net/~ace2/m-annual.htm

All the templates are located in
http://www.users.on.net/~ace2/minifiles/

Any idea what I've done?
Only looks wrong on mobile devices..

[ace2]

I should also add, I'm trying to make it HTML 5 compliant....

Original templates were a bit of a mess......

[mcrossley]

You have a lot of   with an additional semi-colon =  ;

By using   in your menus you are forcing them to be one long line is that what you intended?

The index page looks similar to all the others to me?

[ace2]

The long line if fine, it doesn't seem to be the issue.
The issue can only be seen on mobile devices (android & iOS ipod)

I find if I change the width of table style for the line"menu - tap/click for" to 122 it centres.

Changing the other table width has no effect on anything???

Something is not right....

[mcrossley]

I'm not quite sure what you think is wrong with those pages?

[ace2]

Ok, it's in the css, if i switch my test files css to the standard one, it centers but of course, it makes the page huge.

http://www.users.on.net/~ace2/m-dailytest.htm

now to see what the issue is from my phone:



now to figures this thing out???

[ace2]

Ok, so if i change the css :

Code: Select all

@charset "UTF-8";
body {
	background-color: #FFFFFF;
	font-family: Verdana, Helvetica, sans-serif;
	font-size: 24pt;
	color: #585858;
	text-align: left;
	background-attachment: fixed;
	background-image: url(images/picture.jpg);
    background-size: cover;
    background-repeat: repeat-x;

so if i change the

Code: Select all

 font-size: 24pt;

to

Code: Select all

font-size: 18pt;

It behaves as it should, i still don't understand why this happens?????