Highlighted

Images justify to the left on android devices but display fine everywhere else

New Here ,
Sep 06, 2018

Copy link to clipboard

Copied

I built a site using dreamweaver which displays fine in all browsers on the computer, but when I visit the site on android device the images justify to the left.

I have all of the alignments set to center but it seems to ignore this. I can't figure out the issue here, please help... thanks

Here is the site: http://skydivefitzgerald.com/

Adobe Community Professional
Correct answer by Jon Fritz II | Adobe Community Professional

You have some errors in your html. HTML errors are a big contributor to display issues across browsers/devices.

Run your page through the validator at http://validator.w3.org/nu and clean up the code. Once the code is clean/valid it may start working correctly for you. If not, post back with the updated code and the contributors here can try to find the issue for you.

Views

189

Likes

Translate

Translate

Report

Report
Community Guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more

Images justify to the left on android devices but display fine everywhere else

New Here ,
Sep 06, 2018

Copy link to clipboard

Copied

I built a site using dreamweaver which displays fine in all browsers on the computer, but when I visit the site on android device the images justify to the left.

I have all of the alignments set to center but it seems to ignore this. I can't figure out the issue here, please help... thanks

Here is the site: http://skydivefitzgerald.com/

Adobe Community Professional
Correct answer by Jon Fritz II | Adobe Community Professional

You have some errors in your html. HTML errors are a big contributor to display issues across browsers/devices.

Run your page through the validator at http://validator.w3.org/nu and clean up the code. Once the code is clean/valid it may start working correctly for you. If not, post back with the updated code and the contributors here can try to find the issue for you.

Views

190

Likes

Translate

Translate

Report

Report
Community Guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
Sep 06, 2018 0
Adobe Community Professional ,
Sep 06, 2018

Copy link to clipboard

Copied

You have some errors in your html. HTML errors are a big contributor to display issues across browsers/devices.

Run your page through the validator at http://validator.w3.org/nu and clean up the code. Once the code is clean/valid it may start working correctly for you. If not, post back with the updated code and the contributors here can try to find the issue for you.

Likes

Translate

Translate

Report

Report
Community Guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
Reply
Loading...
Sep 06, 2018 0
LEGEND ,
Sep 06, 2018

Copy link to clipboard

Copied

I see a whole lot of "Use CSS instead" messages. 

yattnice, I suspect all the deprecated attributes that you are using might be the culprit.  Remove all the height and width attributes, convert them to CSS, you should be fine.

HTH,

^ _ ^

UPDATE: Or as ALsp stated, get rid of the tables (I didn't know tables weren't responsive.)

Likes

Translate

Translate

Report

Report
Community Guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
Reply
Loading...
Sep 06, 2018 0
Mentor ,
Sep 06, 2018

Copy link to clipboard

Copied

Tables can, after a fashion, be made responsive with CSS. But the OP's tables are most certainly not.

Likes

Translate

Translate

Report

Report
Community Guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
Reply
Loading...
Sep 06, 2018 1
New Here ,
Sep 06, 2018

Copy link to clipboard

Copied

Excessive rows and columns were the culprit so in fact I did just "clean it up" and now it works fine... again thanks everyone for your suggestions...

Likes

Translate

Translate

Report

Report
Community Guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
Reply
Loading...
Sep 06, 2018 0
Mentor ,
Sep 06, 2018

Copy link to clipboard

Copied

The page errors are anecdotal. Your page is table-based and not responsive. All bets are off with respect to phones. It will never display usably on a phone.

Likes

Translate

Translate

Report

Report
Community Guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
Reply
Loading...
Sep 06, 2018 0
New Here ,
Sep 06, 2018

Copy link to clipboard

Copied

I figured it out I just had to remove the top columns and rows that weren't being used and now it works fine thanks... check on your phone for yourself...

Likes

Translate

Translate

Report

Report
Community Guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
Reply
Loading...
Sep 06, 2018 0
ALsp LATEST
Mentor ,
Sep 06, 2018

Copy link to clipboard

Copied

Just a tip...

It's often not necessary to fire up your phone's browser. Simply view the page on your laptop/desktop and make the window narrow. However, since your page is not responsive, what happens is that an enormous horizontal scroll bar appears. What this means is that a phone (any phone) will see that the page is not responsive, and missing a viewport meta tag. So, what will it do? It will simply attempt to shrink the page to fit inside the phone's viewport.

The page would be extremely easy to fix, which would make it far more user friendly to phone users. But it's your decision.

Likes

Translate

Translate

Report

Report
Community Guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
Reply
Loading...
Sep 06, 2018 0
Adobe Community Professional ,
Sep 06, 2018

Copy link to clipboard

Copied

The ALIGN attribute  as you have used it is obsolete.  Some browsers won't respect it.

Nancy O'Shea, ACP
Alt-Web Design & Publishing

Likes

Translate

Translate

Report

Report
Community Guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
Reply
Loading...
Sep 06, 2018 0