i was using happily liveserver in vs-code for a long time , but there are few days when i run my html document with live server in chrome and go to the chrome responsive section in developer tools
live server going to offline
please help me
thanks =)
enter image description here
Related
I recently added some text effects to my website in HTML and CSS. It runs perfectly on VS Code live sever but whenever I upload the code files on to my cpanel, the effects just seem to go away when I actually click and go on my website and I am not sure why. Does anyone know a fix for this? Here is my website julianwsanchez.com
And this how it is supposed to look:
How It Looks When I open it:
The output I'm seeing on your site matches the output of the code snippet here, effects and all.
Check to see if you have some browser extension that affects the way a site might look (e.g. a dark mode extension). Also, try going to your site in a different browser and/or in Incognito mode.
it Works for me just fine, both the link given, and the files running on localhost
You might need to do a hard reload.
try Ctrl-Shift-R on chrome when viewing the page.
This clears the browsers cache for that webpage,
alternative: open the web page in another browser.
I am working on writing my first serious website as a personal project and would like to test it for mobile friendliness and compatibility before I go through the process of actually configuring the FTP, etc. Is there a way to do this using just the files locally on my computer? I've tried to research a way to just upload all the site files and view how everything would look on a mobile browser, but I have not been able to find anything. Or, is there a way to open the HTML files on my phone in a browser, i.e. Chrome?
the best way -> https://www.google.com/webmasters/tools/mobile-friendly/
Google Offers Tips to optimize your site template and a higher quality of mind
You can test your website using google webmaster tool here.
If you wanted to test it locally then you can try different extension for different browsers.
for chrome check this extension it will help you a lot.
In addition to others - http://www.mobilephoneemulator.com/.
And of course, you can test your website with your smartphone.
So I'm running my Rails app on a Nitrous.io server, and Chrome's web inspector is displaying some weird behavior that I've never seen before. When I try and modify some CSS in the web inspector, it automatically switches back to the previous CSS and doesn't make any live changes. I've never experienced this before and rely heavily on web inspector to work on the CSS of my site.
I'm currently running Chrome OS v29.0.1547.74 on a stable build.
I would post my css file but it's pretty long. Any idea where I should start looking to debug this? I really need to be able to make live changes in the browser to work on this site.
My CSS passes the W3C CSS Validator, all I get are warnings for 'unknown vendor prefixes'.
I followed the approach mentioned in how to emulate a mobile (android) browser on desktop
to project the mobile webpage's properties on desktop chrome browser. I was successfully able to do that but now I have some queries as mentioned below, please let me know your inputs on that
a) How to use the "Select element option" of chrome developer toolbar to view an element's property for a mobile webpage. In normal desktop chrome browser we have the web page displayed and below that the developer toolbar is displayed and we can easily spot the element using a pointer but with mobile webpage displayed on desktop chrome browser i am not able to use this option as the webpage is not displayed.
b) I tried to copy the xpath and other things from the displayed HTML (HTML of mobile webpage on desktop chrome browser) but it gave me an error that "You need to install a Chrome extension that grants clipboard access to Developer tools". I installed one such extension named: "Auto Copy" but then also I was not able to copy. Please let me know how to go about it.
Thanks a lot in advance,
Namit
For (B) – Judging from the discussion when that message was introduced, it sounds like you need to roll your own simple custom extension to enable clipboard access. Here's a sample manifest.json – I haven't tested it out myself, but it looks pretty straightforward. The extension development Getting Started guide explains how to turn a file like this into a working extension and install it locally.
I need to find overall page size (CSS, JS, Images and HTML) after page load. Saving page do not save dynamically loaded images, so unable to find the exact page size. Any info for online tool or browser plugin will be great.
Thanks in advance.
you can use Firebug, and also Yslow Extenstions, in order to view the performance of the web sites. in btw you can follow this standards Yahoo guidelines for Speedup PageLoading
Yslow : YSlow homePage
FireBug :Firebug tool
FIddler Web Debugging tool Fiddler
Firebug or the built-in Developer Tools in Chrome.
I just developed a Chrome extension to answer this: Page Size Inspector. It reports page size, cache usage, network requests, load time.
Open source at GitHub.
Install addons web developer on firefox
from here
https://addons.mozilla.org/en-us/firefox/addon/web-developer/
and from web developer toolbar select information/view document size
have fun