Remove the empty space between lines of images

Is there a way to remove the horizontal and vertical space between the squares?

<div class="first">

  <ul>
    <li><img src="http://dummyimage.com/40x40/111111/000000.jpg"/></li>

    <li><img src="http://dummyimage.com/40x40/222222/000000.jpg"/></li>

    <li><img src="http://dummyimage.com/40x40/333333/000000.jpg"/></li>

    <li><img src="http://dummyimage.com/40x40/444444/000000.jpg"/></li>
  </ul>
</div>  
<div class="first">

  <ul>
    <li><img src="http://dummyimage.com/40x40/555555/000000.jpg"/></li>

    <li><img src="http://dummyimage.com/40x40/666666/000000.jpg"/></li>

    <li><img src="http://dummyimage.com/40x40/777777/000000.jpg"/></li>

    <li><img src="http://dummyimage.com/40x40/888888/000000.jpg"/></li>
  </ul>
</div>

https://jsfiddle.net/ruyer/x61h9s4a/

htmlcss

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

What is the best way to showcase a list in three columns using PHP?

I've been struggling for hours to create a PHP code that will display a list in three columns with the following order: A D G B E H C F I Unfortunately, my current code only lists items in this order: A B C D E F G H I Here is the code I am curren ...

phphtmlhtml-table

The Android WebView is unable to run JavaScript code in a local HTML file

Currently, I am attempting to load a local HTML file from the assets folder into a webview. Even though I can successfully load the HTML file in the webview, there seems to be an issue with the file's reliance on an external .js file for calculations. ...

javascriptjavaandroidhtml

Navigating through a modal without affecting the main page's scroll position

My webpage has some content, and I also have a modal that pops up on top of it. The problem I'm facing is that when I try to scroll the contents within the modal, only the contents behind it scroll instead. Below is the CSS code: html, body { b ...

htmlcssmodal-dialog

Header fixed vertically

I am currently working on a webpage with a minimum width requirement of 1124px. This means that whenever the browser window is smaller than that, the content of the page needs to be scrolled horizontally instead of smoothly transitioning into a responsive ...

javascriptjqueryhtmlcss

Guide to creating HTML file with SSI tags

Currently, my website uses Nginx SSI tags to dynamically include template files such as the header, footer, and sidebar. However, I need to provide the final HTML output to clients instead of running it on their browsers. The issue I'm facing is that ...

htmlnginxssi

What is the best way to switch the visibility of a div on click from another div?

My goal is to make a div toggle visible or hidden when another div is clicked. The only connection between the two divs is that they are both nested within the same parent div. There's a DIV element with the class of "comment" which contains a DIV ele ...

javascriptjqueryhtmlcss

Odd gap beside Bootstrap5 navbar that needs fixing

While working on a layout featuring a left-sided nav-bar menu, I encountered an odd blank space between the navbar and the main content area. Can anyone shed light on why this space appears and how to eliminate it? For reference, here is the code snippet: ...

javascripthtmlcssbootstrap-5

Render data from a RESTful Express API using AJAX and Node.js to display on a webpage

New to node.js development and facing a specific issue. My goal is to build a single-page web app using node.js where users can submit request data, retrieve information from the IMDb API, and display it on the same page. Here's my code: server.js # ...

ajaxnode.jsexpresshtml

The size of HTML select input varies among IOS, Android, and Windows devices

Does anyone know of a CSS property that can be used to tailor the styling specifically for IOS devices in order to achieve a similar look to that of windows and android?https://i.sstatic.net/VMSXb.jpg I attempted using -webkit, but unfortunately it did no ...

javascripthtmlcssresponsive-designselectinput

Encountering a JS error that states: "Uncaught SyntaxError: missing ) after argument list" when running the following code

I keep encountering the error message: "Uncaught SyntaxError: missing ) after argument list" when I try to call the delete function within the createHtmlview function. console.log("Delete Item is being called") } ...

javascripthtml

Assistance needed with extracting specific information using Ajax and C#

I have developed an employee management website using .Net and ASP Entity Framework. On the main page, you can view a list of all employees with their names. However, clicking on a specific employee takes you to another page Profile/Index, where only deta ...

c#htmlasp.netajax

Tips for including a lang attribute in HTML tags within Next.js

When I ran a performance check on my Next.js portfolio site, I discovered that the main index.html is missing a lang attribute. This absence results in a deduction from the accessibility score. I could add the locale by configuring i18n setup in the next. ...

htmlreactjsnext.js

Adjust the positioning of a class element

I have an eye icon that changes position when clicked. Initially, it is set to left: 10%;, but if there is a DOM element with the ID login-section, it should be repositioned to left: 50%;. I attempted to use document.getElementsByClassName('fa-eye-sl ...

javascripthtmlcss

Tips for changing the appearance of an entire table by overriding the table tr:nth-child styling

In the CSS code below, I currently alternate background colors for table lines by default and can specify individual rows to not alternate. Is there a way to implement this at the table level instead of per row? Essentially, I want to define something at ...

htmlcss

Creating a dynamic div with various paragraphs using only Javascript

My goal is to dynamically generate paragraphs with their respective icons inside individual div elements. For instance, if the service API returns 30 items, I will create 30 div elements with the class "tile". However, if only one item is returned, then I ...

javascripthtmljsonclass

Tips for creating equal height columns in Bootstrap 4

Working with Bootstrap 4 Beta in an attempt to create two columns that maintain full height regardless of screen size. The code below functions perfectly, ensuring both columns maintain full height across all devices. However, upon inserting the bootstra ...

javascriptjqueryhtmlcsstwitter-bootstrap

Guide to adding a Json file in a PHP file with PHP

I have a PHP file with an embedded JSON file, and I want to update the JSON file with new information from a form. The form looks like this: <form action="process.php" method="POST"> First name:<br> <input type="text" name="firstName"> ...

javascriptphphtmljson

A guide on integrating Javascript and CSS files in Express.js

I'm currently running a simple node server from a page.js file as part of a system setup test. Here's the code snippet: var express = require('express'); var app = express(); app.get('/', function(req, res) { res.sendFil ...

htmlnode.jsexpress

How can I change the background color of a parent div when hovering over a child element using JavaScript

I am working on a task that involves three colored boxes within a div, each with a different color. The goal is to change the background-color of the parent div to match the color of the box being hovered over. CSS: .t1_colors { float: left; wid ...

javascripthtmlcsscolorshover

Manipulating Width in CSS

I am facing a challenge with the HTML code below where an automated software inserts the initial CSS style g2f0 <div class="linelevel row"> <div class="g2f0 col-sm-6 form-group"> <label for="name">Name</label> < ...

jqueryhtmlcsstwitter-bootstrap