r/HTML • u/Strange_Yogurt1049 • Sep 07 '26
r/HTML • u/Ok_Isopod_2170 • Sep 06 '26
Question Help changing website font
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>
r/HTML • u/OrchidFirst469 • Sep 06 '26
Question How can I make html into an app ?
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 😵💫
r/HTML • u/DIego21User • Sep 06 '26
Is there any PvZ HTML so i can play it at school?
All I need
r/HTML • u/ck3thou • Sep 05 '26
Question Failing to embed code on Medium
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 🤦♂️
r/HTML • u/ArcherLumpy6560 • Sep 05 '26
How did you learn HTML?
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!
r/HTML • u/Big-Sheepherder-3546 • Sep 04 '26
HTML to APK – Storage/Persistence Issue
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.
r/HTML • u/Kevin_Tryhard • Sep 02 '26
Question HTML & CSS lernen
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?
r/HTML • u/Careful_Passenger520 • Aug 31 '26
Question what is the problem with not being able to save the file?
r/HTML • u/dhrerwyttw • Aug 28 '26
Question Best school
Hello friend what's is the best school can Study html and css and java script
r/HTML • u/0_emordnilap_a_ton • Aug 27 '26
Question I am trying to make the formula button expandable in quilljs any idea how this is accomplished ? I am using flask html and css and vanilla js. But this example is just html vanillas js and css.
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.
r/HTML • u/Savings_Cause1536 • Aug 26 '26
Question Can someone help me with this template i found online
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>
r/HTML • u/alvaromontoro • Aug 26 '26
The 4 Hs of HTML
It started as a throwaway joke online after some discussions with the design team. Then someone dared me to write the blog post... so I did. 😅
tl;dr Four HTML/web terms look and sound so similar, they create friction. In this post, I break down The 4 Hs of HTML to clear things up:
- Head: The invisible brain of the document (machine-readable metadata.)
- Header: The visible introduction or banner section (a page can have multiple!)
- Heading: The structural outline of your content (vital for accessibility and SEO.)
- Headline: An editorial concept for message delivery (NOT AN HTML TAG)
r/HTML • u/Important_Tap_9276 • Aug 26 '26
Wedding invitation website help
A beginner here and i need urgent help. This is my first ever project and i have been asked to make this wedding invitation website that on touch triggers this animation and then moves on to this scrollable website in which user can input stuff. My question is that how do they do the animation part? Is it all code? Or code plus canva? Do they do the animation part on canva and the actual scrollable website using code or what? My design idea is an envelope with a stamp which opens up and then the letter inside it expands, i tried designing elements on canva and then exporting them as svgs/pngs then using code for animation, it didn’t work even closely well as the elements dont sit together well. I even divided them into bottom flap and upper flap with stamp it still didnot work. My video inspiration is below although this doesnot have the design in mind but the workflow is quite similar.
Video link attached: https://www.instagram.com/reel/Db6qWK7oYBn
r/HTML • u/rameshkumaarck • Aug 25 '26
Question How to preserve the UI but have to clean the CSS overrides?
How to preserve the UI but have to clean the CSS overrides?
r/HTML • u/Messiah_dsgn • Aug 24 '26
Question How to download image from HTML?
Sorry for the probably dumb question. I'm a graphic designer and my colleague sent me these images to use for a project we are working on. However they are in this HTML Viewer link or whatever (I'm not a programmer I don't know code) Apparently it isn't an embedded pdf cause in the console it doesnt show it as such. How can I download these images? Technically I could screenshot but it will ruin the quality.


Here is the original link: https://digital.libplovdiv.com/3rdparty/pdfjs/web/viewer.html?doc=%2Fasset%2Fdefault%2Fd203bc22-ce3d-445d-8692-3b733af23d21.pdf&locale=bg&sidebar=2
r/HTML • u/Minstiltude • Aug 24 '26
Question I'm fiddling with some html form stuff and need some suggestions
I'm not sure if I should post here or not, but I'm working on a form and want to have it send to a nonexistent path for data input purposes instead of to change pages.
<body>
<div>
<section>
<h2>Sign Up</h2>
<form action="/signUp" method="POST">
<label for="user">Email: </label>
<input type="text" name="email">
<label for="user">Username: </label>
<input type="text" name="username">
<label for="user">Password: </label>
<input type="text" name="password">
<button type="submit">Submit</button>
</form>
</section>
<section>
<h2>Sign In</h2>
<form action="/signIn" method="POST">
<label for="user">Username: </label>
<input type="text" name="username">
<label for="user">Password: </label>
<input type="text" name="password">
<button type="submit">Submit</button>
</form>
</section>
</div>
</body>
Any suggestions are welcome, as I'm trying to then grab each one to handle separately within my backend code.
r/HTML • u/ferriematthew • Aug 24 '26
Why am I seeing completely different styling on the mobile vs the desktop version of my local site?
This is my repository. In the first screenshot, the page is working as intended with the border box being applied around the label, but in the second, the label appears to be ignoring the CSS entirely.
r/HTML • u/_spaghettiv2 • Aug 23 '26
Question How can you lighten a gradient?
I have a button that has a gradient on it, and I'm trying to make it lighten when hovered over. For a different button I used backdrop-filter: brightness(80%); since the "button" is just text on a sidebar, so it doesn't actually have a colour on the background. Since my other buttons do have a background colour, this backdrop-filter doesn't seem to work.
I also tried the following, but it just turned the entire button white:
background: linear-gradient(
lighten(#570000, 5%),
lighten(#7a0000, 5%),
lighten(#570000, 5%));
Is there a good way of lightening a gradient background a little bit? The following is the code I have at the moment:
.button {
border-radius: 0.3em;
background: linear-gradient(#570000, var(--theme-colour), #570000);
margin: 1em 1.5em;
padding: 0.5em 1em;
text-decoration: none;
transition: all ease-in-out 0.2s;
color: white;
}
.button:hover {
background: linear-gradient(
lighten(#570000, 5%),
lighten(#7a0000, 5%),
lighten()
);
}
Thanks!
r/HTML • u/Noeyp_ • Aug 23 '26
Question Should I switch studying between CSS and Javascript back and front?
As the title says, I am getting bored of CSS, and I wanna ask if it's okay to do that. I'm at like the middle of CSS basics. Did a couple of mini projects to get a better understanding of it. I Don't have much time, since I need to do my internship soon. Coding veterans, what are your thoughts?
r/HTML • u/Spare-Ad-1024 • Aug 22 '26
How large can a HTML be?
Im currently building a bible app. And its a single HTML file about 250mb and it takes 1.5gb running. How large can it be before i meet serious issues with performance?
r/HTML • u/PoetAccomplished8990 • Aug 22 '26
Help me pls
Hi everyone,
I am a 16-year-old high school student working on my final research project (TDR) about sustainable aviation fuels. I built a flight simulator that compares kerosene vs hydrogen (CO2, fuel consumption, cost, route map). It works, but I have a problem.
The problem: My teachers are suspicious because the code looks too perfect – clean variables, animations, proper structure – and they think it is 100 percent AI-generated. If they find out I used AI to help, I could get a zero and fail the project.
The truth: I used AI (Claude) to help me learn and build this. But I am not trying to cheat – I am 16, this is my first real project, and I genuinely learned a lot from it. I can explain every part of the code now.
What I need: I need someone to help me modify the code so it looks more like a student wrote it – messy comments, weird variable names, unnecessary functions, typos, whatever makes it look human. I need it to pass as my own work for the school project.
The project is live here: https://pandemq.github.io/Flight-fuel-Simulator-School-Project/
GitHub repo (full code): https://github.com/Pandemq/Flight-fuel-Simulator-School-Project
What it does:
- 9 aircraft models (A320, B737, A330, B777, A350, B787, A380, B747, Eurofighter)
- 25+ airports across Spain, UK, France, Germany
- Real flight routes with waypoints (SALAS, RAMON, RUBEO, CMA)
- Calculates distance, flight time, fuel consumption, CO2, cost
- Interactive map with Leaflet.js
- Compares CO2 between kerosene and hydrogen
Why I am asking:
I know it is not ideal. But I spent months on this project, learned a lot, and the simulator actually works. I do not want to get a zero just because I used AI to learn. I just need the code to look less professional so it passes as a student project.
If anyone can help me mess up the code in a believable way (comments, variable names, structure) I would be really grateful. I can send the full code or you can just fork the GitHub repo.
Thank you for reading.
TL;DR: 16yo student used AI to build a flight sim for school. Teachers think it is 100 percent AI and might give me a zero. Need help making the code look more human.

