-2

As a beginner starting my first project, I wanted to download an extension so that I could see my code while coding it and do a split screen thing. So following instructions I got from chatgpt I installed the extension live server ( by ritwickdey) and when I clicked on its file, at the bottom right of the page there was a small symbol that says go live when you hover over it, I clicked and it directed to my web project live server which was fine now from there I have both my visual studio code and live web browser sever opened I go on VSC and right click on my HTML file specifically then click split to the right. I was expecting to have the live web browser split to the right vertically and adjustable but it wasn't it was my current HTML code but just copied and split to the right I tried other options from what it gave me before that remotely related to what I was trying to do like open with the live server but they didn't work. I tried some troubleshooting like copy-pasting the link into a different browser and trying again and closing the app and trying again. After that, I went searching for another way to do split screen I found one on a yt tutorial and started by going on the view option at the top left click on it, and from there going to the command palette then searching live server/open with the live server then from there I go on the HTML tab at the top right click then click split right I was expecting for it to work and have my live web server browser open but it didn't. Can anyone help me and tell me what I should do?

rioV8
  • 24,506
  • 3
  • 32
  • 49

1 Answers1

0

It looks like all you're trying to do is view both your code and your browser simultaneously.

You can do this by re-sizing your Visual Studio Code window and placing it on the left of your screen, then re-sizing your browser window and placing it on the right of your screen (or vice versa, depending on your preference).

Whenever you update your code (HTML, CSS, etc.) the Live Server extension will automatically refresh your browser window, allowing you to see your website.

  • thank you can you tell me how? ( by that I mean how do I re-size my visual studio window and do everything you mentioned in the reply) I think this will fix the problem thank you :0 :)!!!!!!! – Your-neigbourhood -developer Aug 16 '23 at 17:41
  • @Your-neigbourhood-developer the specific way to re-size a window will depend on the operating system you're using (Windows, macOS, Linux etc.) Which operating system does your computer run? – Sam Cutter Aug 16 '23 at 21:25
  • very sorry for the late reply but Im usind windows – Your-neigbourhood -developer Aug 25 '23 at 17:04
  • No worries. Here's what you need to do: 1. Move your mouse to the top right corner of your screen. 2. Look for a symbol that resembles two rectangles stacked on each other. 3. Click on that symbol to exit full screen mode. 4. Now, you can adjust the size of the window by dragging its edges. 5. Do the same for your other window (web browser). 6. Arrange both windows side by side for better visibility. – Sam Cutter Aug 26 '23 at 21:13