Have you tried adding a height and width attribute to your img tag?


A quick look at your source code shows you gave it a class of responsive, but I don't see that class defined in style.css, you might consider adding that in.

thanks!

neither worked 🙁

see Home

i dont get how it looks so different from VSCode to published

Hello again, Pavel.

It's not clear to me at all what exactly your issue is. None of the lines in your post makes that clear. Just posting a link to your site does not explain anything to someone who does not know what the problem is. What's this "VSCode vs. published" stuff ? What does it look like on your iPhone ?
Why does the image have class responsive when that class is not defined anywhere ?
Ans why do you say you are not familiar with DevTools console ? Is that because it still gives the same errors I alerted you about earlier, about styles from index.css and location.css not being applied. Do these files even exist ? Does one of them perhaps have the definition of class responsive ?

You should get familiar with the DevTools console, it is the most essential tool in web development.

cbreemer said:

Hello again, Pavel.

It's not clear to me at all what exactly your issue is. None of the lines in your post makes that clear. Just posting a link to your site does not explain anything to someone who does not know what the problem is. What's this "VSCode vs. published" stuff ? What does it look like on your iPhone ?
Why does the image have class responsive when that class is not defined anywhere ?
Ans why do you say you are not familiar with DevTools console ? Is that because it still gives the same errors I alerted you about earlier, about styles from index.css and location.css not being applied. Do these files even exist ? Does one of them perhaps have the definition of class responsive ?

You should get familiar with the DevTools console, it is the most essential tool in web development.

Click to expand...

first, sorry if i upset you or pissed you off 🙁

i hope i am more clear now

in posting my link, i hope it can be reviewed and analyzed.... to find problems

"
What's this "VSCode vs. published" stuff ? What does it look like on your iPhone ?
Why does the image have class responsive when that class is not defined anywhere ?"

to be more clear my text editor VSCode displays the code in one way and the site live on the web displays another. a head scratcher for me 🙁 so i reached out.

on my IPhone index.html the chair image is quite large... to follow up here its only large there, not in my text editor

i removed my responsive class, though i did try adjusting that class in my style.css


"index.css and location.css" i never coded these 🙁 no clue why they are there... they do not exist

and the console is foreign to me right now

"You should get familiar with the DevTools console, it is the most essential tool in web development"

BINGO! i have been trying to learn dev tools 🙂 a bit over whelming to start... though i want to learn this, so i will push and put in the effort to learn 🙂

seriously, i do appreciate your time and trouble helping me here 🙂

i kindly ask for the code and an explanation so i can take away value from your help

MANY THANKS!!

again, did not me to irritate you! i am sorry!

I'm not sure why you worry that I am upset or irritated. I'm just being short and to the point as always. Nothing personal 😊

Sorry to say it is not at all clearer to me now... you are basically repeating what you wrote earlier, using some different words. Anyway I cannot help you with how it may look on your iPhone, as I have not got one. It seems to look fine on my iPad and my Android phone, more or less the same in fact. But of course I can't be sure because I don't know what exactly you mean with "quite large".

I'm puzzled that you have no idea why index.css and location.css are mentioned in the Console. Your HTML links to them in lines 9 and 10 !

If you do not have these files, you should remove these links from your code. I realize this is not related to your problem, but at least you get rid of these error messages in the Console and it may look a little less overwhelming 😁

easy enough to remove 🙂

i am trying to learn chrome dev tools...

a bit overwhelmed and intimadated

tell me...

what should i study first?

note: i know almost no JS

thanks!

Yes, DevTools do seem a little bewildering at first. Start with always keeping an eye on the Console, taking any messages in there seriously insofar as they originate from your own code (the source location is always displayed on the right of each message).
Then, play around with the Inspect function in the right mouse context menu of your browser, to look at any element of your page (for example right mouse click on your image). Just fool around until you get the idea of it.
For learning JS I would recommend doing a tutorial such as this one W3C JS tutorial

Pavel said:

hello,

see

Home

off line VSCode is MUCH different

the chair image is massive on my Iphone, and smaller on desktop online

i am after the desktop look, smaller and have the text wrap

.... i would still l ike to tweak the desktop, but i want to resolve his first

i have tried to fix it, no luck..

i tried different browsers

i tried media queries

i tried using the style.css

my guess is there is somehing wonky between my local site and remote site... but thats only a guess 🙁

note: i am not familiar with the console in dev tools

pleae help me here 🙂

Click to expand...

Hi there @Pavel
Can you please clarify on your actual issue? Is it design/code related, or is it host related? I am asking because you have titled your thread "FTP problem?", but as I am reading through the commentary, I see that your issue is more code related. FTP stands for File Transfer Protocol, which as the name implies, is the procedures used to move files from your machine to a hosting server and vice versa. Are there any issues with you moving files to your server?

I wondered about that FTP too... but forgot to ask.

cbreemer said:

Yes, DevTools do seem a little bewildering at first. Start with always keeping an eye on the Console, taking any messages in there seriously insofar as they originate from your own code (the source location is always displayed on the right of each message).
Then, play around with the Inspect function in the right mouse context menu of your browser, to look at any element of your page (for example right mouse click on your image). Just fool around until you get the idea of it.
For learning JS I would recommend doing a tutorial such as this one W3C JS tutorial

Click to expand...

@Pavel ,

Not knowing how much you know, forgive me if this is old news...

As mentioned, playing in the devtools can help you feel more comfortable. Something not readily apparent is that you can manipulate the DOM - the html elements on the webpage, most likely the html you wrote - which is handy in testing and designing.

Right-click on an element on your webpage - a headline, for example (h1) - and you can actually adjust the css in the devtools pane that shows the css.