Enhancing Your HTML Formatting in PHPStorm

I have a list of li elements and ran into the issue of unwanted space between inline block elements. To address this problem, I used the comment trick which worked fine initially. However, when I tried to format the code using PHPStorm, the comments were not placed correctly anymore. Is there a way to adjust this setting in PHPStorm? The issue can be seen in the example below.

<li>Hello</li><!--
--><li>Second</li>

This is what happens:

<li>Hello</li>
<!--
          -->
<li>Second</li>

Answer №1

To address this issue, my recommendation would be to turn off formatting for specific blocks, such as:

<!--@formatter:off-->
<li>Greetings</li><!--
--><li>Second Item</li>
<!--@formatter:on-->

Additionally, remember to activate formatter markers in Settings/Editor/Code Style, under the option

Enable formatter markers in comments
.

Similar questions

If you have not found the answer to your question or you are interested in this topic, then look at other similar questions below or use the search

Waveform rendering in HTML5 using wavesurfer.js struggles to handle large mp3 files

Recently, I was considering incorporating wavesurfer.js into one of my projects so I decided to explore the demo on To test it out, I uploaded a large mp3 file (approximately 2 hours long) onto the designated area in the middle of the page. It appeared to ...

How to present retrieved data with spaces or line breaks in PHP

I need help on how to display data with spaces or line breaks. Currently, I am using textarea for the news content when adding and editing, and the data type for my news content is text. This is how I want the content to be displayed: https://i.sstatic.ne ...

"Enhance Your Website with a JavaScript Slide Feature, Hidden Text Animation,

I've encountered some issues with my code: HTML: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> ...

Unable to adjust the main-container height in Bootstrap to 100%

I'm struggling to set the height of my .main-container to 100%. When I try to do that, the height ends up being too high. Here is a screenshot for reference: enter image description here .main-container { height: 94vh; } Here is some of my code ...

Can a file be transferred to the server using only client-side scripting via HTML, CSS, and JavaScript?

Currently, I am looking for a way to upload a file onto my server for personal use. The downloading part is sorted out, but the challenge lies in figuring out how to upload without relying on server side scripting. I have been able to find a solution tha ...

What is the best way to fill in predetermined HTML with information using jQuery?

Currently, I am working with several ajax forms that allow me to add rows of data dynamically using ajax. While the form submission is functioning correctly, I am having trouble figuring out the best way to append the newly inserted data into the database. ...

Can CSS content be used to showcase an .html document or .html fragment?

Referencing the MDN documentation for css content: /* <uri> value */ content: url(http://www.example.com/test.html); Inquiry: Can an image be displayed using the url() value of the content property in a css html element? .content { conte ...

Repositioning with Flexbox: shifting the middle element to a new line

I have a flex item that contains three divs. ┌────────────────────────────────────────┐ | WRAPPER | | ┌─────────┬─ ...

Different ways to prevent invalid entries in an input field with type datetime-local

<input type="datetime-local" step="1"> Is there a way to prevent invalid date input? For example, entering a date like "11:11:1111" in the format "mm-dd-yyyy". How can this be addressed using Moment.js? ...

Incapable of smoothly scrolling through individual div tags

I am facing an issue with my ajax page (search.js) attached to my main page that runs a setInterval every 2 seconds. On the main page, I have a div tag (class="view") that can slide down and interrupt the interval. Everything is working fine except when I ...

JQuery is not able to render Hindi content properly

I am attempting to showcase some Hindi words using JQuery because these are essential contents that need to be displayed on every page of the website. Please note that this is a static website built with HTML and JQuery/JavaScript. Below is my JS file: in ...

Dynamic Bootstrap User Authentication Form

Currently, I am in the process of constructing a login form for my web application and have opted to use Bootstrap for its styling. To ensure that the screen is responsive, I've integrated the following "Meta Tag" into the structure: <meta name="v ...

The data type "100%" cannot be assigned to a number type in the kendo-grid-column

I need the columns in the grid to have a width of 100%. <kendo-grid-column field="id" title="id" [width]="'100%'"> </kendo-grid-column> However, when I hover over the code, I get this message: The value "100%" cannot be ...

Storm, the crooning guitarist, and real-time alerts

After conducting research on various platforms, I have only found information on using Tornado as an HTTP server. My current dilemma is how to initiate push notifications within this system? To provide some background... The database I am dealing with ...

Designing a navigational sidebar featuring clickable links to specific locations on Google Maps

I'm currently utilizing a map script created by Derek Ender that integrates with Google Fusion Tables to display locations on a map. While the script is functioning well, I have received a request to make the sidebar list of locations clickable. The ...

Tips for creating a double-layered accordion list within another accordion list:

I am currently utilizing this example to create an accordion list, but I require a two-level accordion list. It should look something like this: -Group -Child1 Child2 Child2 +Child1 +Child1 +Group +Group For reference, you can check it ou ...

Customizing the CSS for individual posts in WordPress based on their post

I am interested in establishing a unique look for each individual post on my wordpress.org blog. Is there a way to customize the CSS code of individual posts without changing the design of other posts? I have tried using categories to create a new PHP fi ...

The DXTreeview feature in AngularJS restricts the expansion of branches

My MVC5 project contains an Index.aspx file, but when I run it in VS2013, only the top branches of the tree are visible without any option to expand them. https://i.sstatic.net/0FWUB.png Resharper confirms that my references are correct. Being new to HT ...

Obtain the href attribute's value from an HTML document using Javascript

I'm facing an issue here. Currently, I am utilizing Grid.js (http://tympanus.net/codrops/2013/03/19/thumbnail-grid-with-expanding-preview/) for my project. Now, my goal is to incorporate a Lightbox with multiple thumbnails inside the dropout provide ...

The alignment for Bootstrap's NAV element within a display:table-cell element seems to be off when viewed on Firefox浪

Here is an example of HTML markup with Bootstrap library included: <div class="container"> <div class="card"> <ul class="nav list"> <li class="element"> <a href="#">Element</a> </li> ...