Sublime Text 4 How to show code results MacOS - html

I'm in a web design class, and my professor wants me to use sublime text as our coding platform. I'm not having any issues coding html, but I can't figure out how to print my results in a web page to make sure I'm following the steps properly. Any advice would be great, as my professor has yet to be any help.
For reference, I am working on a Mac that's running macOS Ventura 13.1, and my web browser is safari
I have tried looking at solutions online but all of the information is outdated or not specifically meant for Mac users

Related

Flickering Video on Safari Browser

I have been developing a website for a client this past week and he tells me the site works fine on chrome but not on safari.
Unfortunatly I do not have an apple device but the site works fine on all the browsers my end!
Here is a video showing how it looks on Safari:
https://a.uguu.se/l0yAhSOlet1C.mp4
Not sure what more I can do to it but I'm pretty sure it's not my code!
Many thanks for any suggestions.
Phillip Dews
I found that the problem is definitely not in your code, it is a know issue I quickly searched on Google and I found that there are quite a bit of people that experience this issue I think probably because they are running an older version of Mac OS.
Here are some useful links you can read and inform your client:
A lot of people have similar flickering patterns.
Link 1
Link 2
Link 3

Foundation and Internet Explorer error

I hope someone can help me. I'm working in the design of a site for real estate. I'm working with foundation 5, it works good in chrome and firefox for mac but when I test the site in firefox and Internet Explorer 11 in a PC it looks weird. I haven't test it in olders versions of those browsers in PC yet.
I have the site in https://dl.dropboxusercontent.com/u/78083017/casinoPlaza/plantas.html
The problem is in the tab panel with the floorplan.
I'm working in the left side menu. I really don't know how to solve the problem because I don`t know where the problem is. I hope someone can help me figure out the problem and how to solve it.
Thanks in advance.
so the problem might be is that you used a MAC computer and usually the OS is different then Windows (PC)
so in other words i'll put a example
let us say if windows 8 works awesome with a touchscreen alright?
but you expect seeing the same interaction with a non-touchscreen monitor?
see? there is going to be a difference trying to adapt to the new hardware/software in your case, you might see that in MAC it looks flawless and that might be true for the mac users who visit your website but you have to know you have to calibrate the website to fit in other "formats" i would recommend you "building" your website in a PC so issues don't pop up that much as they are happening right now/

HTML5 offline needs to work on mobile devices canvas kineticjs

sorry if this has been posted before i have looked around and havn't been able to find an appropriate answer.
I am currently recreating an extremely old Introduction To Music Theory textbook for school which is in website form, but it uses flash and we are updating it so it can be ran on mobile devices. I am using html5 jQuery and KineticJS, i have lots of code working for typical computers but i can't get my code to run on an ios or an android tablet, what is the appropriate thing to do, should i have been using a tool like phoneGap all along? Please any insight to how I should go about this would be amazing!
Thanks

Images look different on web server

I've just realised that on my website, the images look a lot different to what they do on localhost. I'm not sure why, it's baffled me.
Localhost preview: http://d.pr/i/6og
Server preview: http://d.pr/i/OWKx
Localhost gradients: http://d.pr/i/C5el
Server gradients: http://d.pr/i/5pGi
Localhost search bar: http://d.pr/i/YL2X
Server search bar: http://d.pr/i/dTCZ
As you can see they're a lot different. I've literally no idea why, I'm wondering if anybody has had the same problem before?
My website: http://wpvault.com/kahlam/
I don't think there's anything in the CSS that could possibly do this? It's strange, quite stuck with this one. Any help would be much appreciated.
Browser: Google Chrome
The problem is color management in browsers. This isn't a fault with your images at all.
Here is the article that I read.
Here is some excerpts from the article in question:
This specific issue exists because there are two types of ICC profiles, V2 and V4 (all you need to know is that V4 profiles are more accurate; refer to this International Colour Consortium document for the technical specifics).
The trouble is:
Firefox 3.0 and Safari understand ICC V2 and V4 profiles.
Firefox 3.5 introduced a new colour management system which no longer understands ICC V4 profiles (great job guys).
Internet Explorer 8 and Google Chrome don’t understand colour profiles at all!
Edit
I also found this link to blurry images in firefox, this could be related to other browsers as well.
I recently faced a weird issue with Firefox. All the images on my blog were rather blurry as if they were wrongly scaled. So I tried with a new Firefox profile and it worked fine. So there must have been some setting or some add-on that is part of the current user profile that is causing this. I removed all the extensions and add-ons to no avail. Just moments ago, I found the solution on the Blitz Research forum. It turns out to be an issue related to the zoom level for a given website, which Firefox 3.0 remembers. By clicking Ctrl + 0, you reset to the no zoom.
Very strange issue but I have all the images back to normal. It seems when I was uploading them from a 2mb connection it was just uploading them into really rubbish quality images. I got home and uploaded them via my 50mb connection and all was fine - all the images are now back to normal. Thanks for the help.

iPad firebug lite or similar

I have read lots of blogs about how to get firebug lite to work on the iPad and from what i can gather it worked at some point but hasn't worked in awhile. I can't get it to work myself.
So my question is has anyone gotten firebug lite or something simliar to work on the iPad recently. With the iPad being so popular I find it amazing that there isn't a good solid developer tool out there for it yet. Especially because in my experience it doesn't render web pages as expected quite often and needs specific tweaking.
Just to stop some quick replies, I already know its a webkit browser and the issues that I have spotted only show up on the iphone and ipad, not in chrome or desktop safari. So i really would love a solution that is native to the ipad itself.
The suggestion below worked for me on an iPad3 running IOS6.
This technique is from http://www.jamesmacfie.com/2012/03/debug-your-html-css-on-the-ipadiphone/
Bookmark any site on iPad then edit the address. Paste in the following code:
javascript:(function(F,i,r,e,b,u,g,L,I,T,E.{if(F.getElementById(b))return;E=F[i+'NS']&&F.documentElement.namespaceURI;E=E?F[i+'NS'](E,'script'):F[i]('script');E[r]('id',b);E[r]('src',I+g+T);E[r](b,u);(F[e]('head')[0]||F[e]('body')[0]).appendChild(E);E=new%20Image;E[r]('src',I+L);})(document,'createElement','setAttribute','getElementsByTagName','FirebugLite','4','firebug-lite.js','releases/lite/latest/skin/xp/sprite.png','https://getfirebug.com/','#startOpened');
Try Remote Debugging with Chrome browser. However iOS 6 comes with built-in support for remote debugging - link.
I've installed this many times (and in the past month on the new iPad) and it has worked.
http://martinkool.com/post/13629963755/firebug-on-ipad-and-iphone
FYI: The directions might be a little outdated so don't give up. What you will be doing is creating a bookmark. Then you edit the link in the bookmark with the script on Martin's website. That also means Firebug Lite can be used on Internet Explorer...although I couldn't edit any elements after getting it up and running.
Good luck!