Mobile website display isn't working correctly - html

I'm currently developing my website, and everything is working as far as I know, except for the mobile page. Below are two screenshots of my mobile page:
The first one displays the adobe dreamweaver preview on my phone. This is how it should look.
The second one displays the website that's online at the moment.
It's the same website as the desktop version.
The files are both the same, but display another result.
Can someone help me with this problem?
What I already did:
Validated my HTML code.
Synched it to the FTP server to be sure I didn't mess up files.
Checked the CSS and my phone width
Thanks in advance.

Can you explain what your problem is?
It seems correct from the screen. Put also a bit of code.
From this point of view I can only ask you if you put the various links to Bootstrap.

Related

Google emulator displays mobile site great but when actually on site it does not work. What can I do to figure out what is broken?

I am trying to figure out the problem that I am having with the website I am creating.
It is a fairly simple website so I have been using flexbox for most of the layout. When I emulate it in Chrome for an iPhone6 or other mobile device the content is all there but when I actually open it on my device on the staging site it disappears. Not sure what is going on.
I am not a very experienced coder and am putting this website together for my dad as a favour for putting me through design school. As a result, some of my code is probably super janky and not the proper way. I was wondering if someone knew what was going on and could point me in the right direction.
The staging site can be viewed at fairfieldtreenurseries.net
Example picture:
Imagery of Differences between emulator and live site
Thanks in advance.

Page layout different on 1st load in chrome

I'm trying to get a job as a developer. I've made a personal website to show employers but I've got a bug. Everything is fine in all browsers except Chrome.
On the first load of the page, the navbar layout is messed up. After you hit refresh or navigate to other pages the proper layout is maintained.
I have no idea what is causing this. Can anyone help?
Link to website: www.alexanderisgr8.com
Possibly a caching issue due to an older css. Try doing a hard-refresh [ctrl+f5]?

Why in dreamweaver does the split and design view not render your css layouts like the live view?

In dreamweaver cs6 the live view works fine for displaying the divs. But when it comes to the design and split view. They both display the divs wrong and it is nothing like what is shown on the live view or in a browser. Is there a reason for that? How do I fix it?
You fix it by not using dreamweaver, and just test your site in a real browser.
It's bad enough that modern browsers have slightly different interpretations of HTML/CSS/JS. I wouldn't want to further complicate things by viewing/testing a website in something that isn't a web browser.
If you want a more useful answer, it would help us if you posted screenshots of the site in dreamweaver vs in a browser.

How do I replicate this website in terms of responsiveness using only css?

Here is the website I want to replicate: http://www.voncarcha.com/contact
Here is my website: http://foxweb.marist.edu/users/kf79g/contact.php
I mainly want to replicate his about page and contact page across all screen sizes that are large medium and small. How can I do this with only css like I did with all of my other pages besides the about page and contact page?
All of my code is located in the page source under these files (after right clicking view source on your browser):
screen_styles.css
screen_layout_large.css
screen_layout_small.css
screen_layout_medium.css
contact.php
about.php
I tried absolutely everything I could think of. I tried to replicate his website, but mine simply does not work as smoothly. Mine especially looks terrible on older browsers IE 7-9 and Firefox, while his does not for some reason. I want my site to be optimized to work across all browsers. I do not know what to do anymore. After this is done, my website will finally be finished. Please help me out I need to get this project done as soon as possible. I would really appreciate any assistance.
Media Queries (currently what you're doing with responsive design) are the part of HTML5 and CSS3. So If you try these features in browsers that do not support HTML5, they will not work.
This link says, It can handle media queries in older browsers. You should take a look at it.
You can also take a look at This one

Google Chrome grey screen problem

Iam a web-developer and recently i have completed and launched a website (im using a CMS joomla for this website with php) and it is working fine in firefox and IE but when iam trying to view it in Chrome it is having a strange problem
for the first two seconds the contents of the website are visible but after that the whole website is greying out and iam not able to view anything on the website. This is happening for the first and even i tried to find the solution on the forums but to no avail......any help will be much appreciated.
Note : I have implemented a video on the home page of the website only that video box and the video playing inside that box is viewable but rest of the page is complete grey.
#chris, abraham, moose thankyou all for trying to help..the problem is solved now, i debugged the code and found out that there was a image in the footer which was creating this problem after i removed that image everything is working fine and perfect now