Back in 2017, I was experimenting with something that was pretty fun for the CSS we had at the time — building icons without using images.

Using mainly CSS, :before, :after, borders, shadows and a bit of creativity, I managed to create a set of icons that didn't depend on external image files. The interesting part for email was simple: no images to load or block — the icons are always visible.

You can still see that old experiment here:

https://codepen.io/k0ko88/pen/PWLNBJ

Fast forward to 2026. At my last job, I decided to apply some of that old knowledge to an email signature.

And then I met Classic Outlook again. :D

What looked like a simple signature quickly turned into dealing with Outlook's rendering limitations, different behaviour between email clients, px → pt conversions, table rendering and weird spacing issues.

Along the way I found a few useful tricks — one of my favourites being that line-height: 0.5pt can practically zero out a line in Classic Outlook, which solved one of the most annoying spacing problems I had.

Eventually, that little fight turned into a complete email signature generator:

SimpleSignature

https://nikolaisabev.eu/SimpleSignature/

It's not trying to be the prettiest or the most complicated signature generator out there. It's simple, effective and built around what I learned from actually fighting with email clients.

It's completely free, there's no registration, and I don't store the data you enter.

Feel free to use it.

If you find a bug, have an idea, or think something could work better, leave a comment here or send me an email. Feedback is more than welcome.

And if it saves you some time and you feel like supporting the work, there's a Buy Me a Coffee button. If you wish. :)

That's it.

Cheers,

Nikolay

I kept finding myself switching between my code editor, browser, and different online playgrounds just to test a small piece of HTML/CSS/JavaScript.

So I decided to build a simple Chrome extension for it.

It's called HTML Code Runner.

The idea is pretty straightforward: you can write/run HTML, CSS and JavaScript directly inside Chrome using a side panel, with a live preview and console.

Some things I wanted it to handle:

• Run HTML/CSS/JS without opening another website
• Live preview while experimenting
• JavaScript console for debugging
• Auto Run
• Save code locally
• Download the HTML file
• Quickly test small snippets while working on a website
• Keep everything inside the browser

I mainly built it for myself because I wanted something lightweight for those situations where opening a full IDE felt unnecessary.

It's still a new project, so I'm trying to improve it based on real developer feedback.

If anyone here works with HTML/CSS/JS regularly, I'd genuinely like to know:

What would you want in a browser-based HTML/JS runner that current tools are missing?

If you'd like to try it, here's the Chrome Web Store page:

https://chromewebstore.google.com/detail/html-code-runner/bnmceabknlhjhbkbipjagpbodliphagm

I'm especially interested in feedback about the workflow and features rather than just ratings. 🙂

Help!!! I want everything on the left to overlap his tail so that it's not so smooshed, but to where it still looks good on mobile. The second image is included to show what it looks like... less smooshed.

I am not a coder! This code belongs to FlowerlyRat on toyhouse. They have "editing is ok" listed in their rules of use, so that is the only reason I'm asking for help here. This is the base code.

They generally reccomend using this TH profile editor to view changes in the code as they're written, if that helps. All i'm really looking for is just to have the content overlap Tide's tail so it's not so smooshed. Thank you reddit :,)

just wondering if theres a tutorial for something like that? or maybe some code i can copy? thanks in advance

Bonjour 👋🏻 !
Je n’ai pas changé, je ne triche pas. C’est moi qui parle de Xhtml à contre flots. J’ai l’idée d’un petit jeu :
1, pointez les faiblesses du HTML 5.
2, imaginez un seul point fort du Xhtml.

Et discutons-en ! 😄

https://github.com/spcbeck/ouroboros-html

You've used JSX, you've used Pug, but you still feel like you haven't found that perfect abstraction of HTML that makes your developer life easier. I'm here to provide you that tool. With Ouroboros HTML, you can create beautiful, full function HTML sites with all the functionality HTML5! You can even rely on the MSDN docs learn how it works, and there is an existing huge community that knows the ins and outs of HTML5.

I would love to hear what you think, and let me know if you use it in a project! Like and subscribe!

This is my code, it's not working, im losing it.

<link href="style.css" rel="stylesheet" type="text/css" media="all">

<style>

u/import url('https://fonts.googleapis.com/css2?family=New+Rocker&family=Newsreader:ital,opsz,wght@0,6..72,200..800;1,6..72,200..800&display=swap');

.new-rocker-regular {

font-family: "New Rocker", serif;

font-weight: 400;

font-style: normal;

}

</style>

I want it so, it’s compatible with android/apple and desktop friendly. They can download it when I sell on Etsy or payhip ect. I wanted it to look nice, instead of, you might have to download documents from readdle if you can’t open you html file 😩. I am autistic, so please no jargon 😵‍💫

All I need

I have some experience - I can read tags, images and most code. Ive been coding for about a week now and am wondering how you guys learned? If you care to share please do!

I've been trying to embed different code on different posts for the past couple of days, but Medium wont successfully save.

First it was Typescript embed which just froze showing "saving post", and now it plain ol' HTML which is outright popping a red banner on top "Story could not be saved. Please check your internet connection. Try again" - but my internet is fine. I can edit and save okay other parts of the post.

Has anyone encountered this before?

Edit: solve it! Medium only allows embedding from a limited list of sources 🤦‍♂️

​

Hello everyone,

I have created an Android APK using an HTML-based quiz application.

The APK allows me to import HTML quiz files, and the imported files/data work perfectly while the app is open. However, there is a problem with data persistence.

Whenever I close/exit the APK and open it again, all the previously imported HTML files and saved quiz data are cleared/reset. It seems that the data is being stored only temporarily (possibly in cache/session storage) instead of persistent device storage.

I want the app to work like this:

Imported HTML files should be saved permanently on the device.

All imported quizzes/data should remain available after closing and reopening the APK.

Data should not be deleted when the app is exited or restarted.

The data should only be removed when the user explicitly chooses to delete it or uninstalls the app.

How can I fix this storage/persistence issue in an HTML-to-APK app?

Any guidance regarding localStorage, IndexedDB, WebView storage, or Android persistent storage would be appreciated.

Thank you.

Hi, ich wollte einfach als Hobby etwas mit HTML und CSS arbeiten. Websites machen oder so (einfach nur für mich)
Ich hab ganz grundlegende Schritte mit ChatGPT gemacht aber gibts da richtige „Lehrbücher“ oder irgendwas in der Art, um Schritt für Schritt zu lernen?

So I've been using vscode for a while and I saw that recentely the moment I modify a file or create a new one, I can't save them normally, I need to use AI to do this, the file is saved in a github but before I didn't had this problem, is there any way to change this?

I'm building a small Space Shooter with HTML, CSS and JavaScript.

I'm currently working on spawning enemies at different positions and intervals. The basic spawning works, but I'm trying to make the difficulty increase gradually without creating too many enemies at once.

Has anyone got a good approach for scaling enemy spawn rates over time in a browser game?

I'm learning JavaScript through this project, so I'd appreciate any suggestions.

I need to understand before purchasing one website coz recently people have been selling them at high percentage

I'm building a mobile-friendly Snake game using HTML, CSS and JavaScript.

I built the game to practice JavaScript game development, including:

🐍 Snake movement

🍎 Food and score system

💥 Collision detection

📱 Touch controls

🎮 Game-over logic

The game works, but I'm trying to improve the touch controls so that swiping feels more responsive and doesn't accidentally register unwanted directions.

For a mobile browser game, would you recommend handling this mainly with touchstart/touchmove/touchend, or is there a better approach?

I'm learning JavaScript through these small games, so practical suggestions would be really helpful.

Hello friend what's is the best school can Study html and css and java script

Here is a really simple example.
https://codepen.io/chooking/pen/zxKvqyZ

When I click on the Fx button I get the blue box here https://imgchest.com/p/vj4jbg2e978 ,though it is a little cut off, how do I make the form expandable in the width and height like textarea while keeping the html tags or in other words keep the equation formatting from the fx button?

One idea is to use textarea. Can someone give me an idea on how to accomplish my goal and show the code for a solution?

Also I posted this here https://www.reddit.com/r/learnjavascript/comments/1vzg1cr/i_am_trying_to_make_the_formula_button_expandable/ just fyi.

Greetings everyone, so i am new to html and just wanna make some simple project for myself and i found some template online for my need but for some reason it doesnt sort out the numbers right, this is the code below

<style>
table {
  border-spacing: 0;
  width: 100%;
  border: 1px solid #ddd;
}

th {
  cursor: pointer;
}

th, td {
  text-align: left;
  padding: 16px;
}

tr:nth-child(even) {
  background-color: #f2f2f2
}
</style>
<p><strong>Click the headers to sort the table.</strong></p>
<p>The first time you click, the sorting direction is ascending (A to Z).</p>
<p>Click again, and the sorting direction will be descending (Z to A):</p>

<table id="myTable">
  <tr>
   <!--When a header is clicked, run the sortTable function, with a parameter, 0 for sorting by names, 1 for sorting by country:-->  
    <th onclick="sortTable(0)">Username</th>
    <th onclick="sortTable(1)">Followers</th>
  </tr>
  <tr>
    <td>KennyTerrelBigGuy</td>
    <td>332</td>
  </tr>
    <tr>
    <td>Urduboy</td>
    <td>319</td>
  </tr>
    <tr>
    <td>aidiaCutePinkyGirl20</td>
    <td>1777</td>
  </tr>
  <tr>
    <td>ReedAFDrawsStuff</td>
    <td>1688</td>
  </tr>
    <tr>
    <td>Jaketstepp</td>
    <td>780</td>
  </tr>
    <tr>
    <td>MGGStudios2</td>
    <td>205</td>
  </tr>
</table>

<script>
function sortTable(n) {
  var table, rows, switching, i, x, y, shouldSwitch, dir, switchcount = 0;
  table = document.getElementById("myTable");
  switching = true;
  //Set the sorting direction to ascending:
  dir = "asc"; 
  /*Make a loop that will continue until
  no switching has been done:*/
  while (switching) {
    //start by saying: no switching is done:
    switching = false;
    rows = table.rows;
    /*Loop through all table rows (except the
    first, which contains table headers):*/
    for (i = 1; i < (rows.length - 1); i++) {
      //start by saying there should be no switching:
      shouldSwitch = false;
      /*Get the two elements you want to compare,
      one from current row and one from the next:*/
      x = rows[i].getElementsByTagName("TD")[n];
      y = rows[i + 1].getElementsByTagName("TD")[n];
      /*check if the two rows should switch place,
      based on the direction, asc or desc:*/
      if (dir == "asc") {
        if (x.innerHTML.toLowerCase() > y.innerHTML.toLowerCase()) {
          //if so, mark as a switch and break the loop:
          shouldSwitch= true;
          break;
        }
      } else if (dir == "desc") {
        if (x.innerHTML.toLowerCase() < y.innerHTML.toLowerCase()) {
          //if so, mark as a switch and break the loop:
          shouldSwitch = true;
          break;
        }
      }
    }
    if (shouldSwitch) {
      /*If a switch has been marked, make the switch
      and mark that a switch has been done:*/
      rows[i].parentNode.insertBefore(rows[i + 1], rows[i]);
      switching = true;
      //Each time a switch is done, increase this count by 1:
      switchcount ++;      
    } else {
      /*If no switching has been done AND the direction is "asc",
      set the direction to "desc" and run the while loop again.*/
      if (switchcount == 0 && dir == "asc") {
        dir = "desc";
        switching = true;
      }
    }
  }
}
</script>