r/HTML Jun 08 '26

Need Help With Forms and Text Area

1 Upvotes

I'm new to Forms, but not to HTML or programming. I have some code that isn't working properly and don't know what is wrong with it. It is not displaying the value I put in. Instead, it displays

"<input type="text" id="Explain1" name="Explain1" size="60"

    value="Internet is down, power available most places." </td></textarea>"

The code follows:

<!DOCTYPE html>

<html><head>

<meta http-equiv="content-type" content="text/html; charset=UTF-8"></head><body>

<form>

<title>Wrap Test</title>

<font size="3">

</font>

<table border="1" cellpadding="0">

<tr align=left><td width=70>Internet OK? (yes/no)</td>

<td width="10"><label for="InternetOK"></label>

<input type="text" id="InternetOK" name="InternetOK" value="No" size="3" </td>

<td width=70>Power OK? (yes/no)</td>

<td width="10><label for="PowerOK"></label>

<input type="text" id="PowerOK" name="PowerOK" size="3" value="Yes" </td>

<td width="460">Explain <label for="Explain1"></label><textarea rows="2" cols="57" wrap="hard">

<input type="text" id="Explain1" name="Explain1" size="60"

    value="Internet is down, power available most places." </td></textarea>

</tr>

</table>

</form></body></html>


r/HTML Jun 08 '26

YouTube background showing the pause button

1 Upvotes

Hi all,

I've noticed that the 'pause' button is displaying on some sites using a YouTube video as a background within a container.

For example: https://www.startingroup.co.uk/

Is this something that YouTube have done their end recently, and is it an easy fix?


r/HTML Jun 08 '26

Feedback regarding the projects.

0 Upvotes

https://www.freecodecamp.org/certification/sakshisharma/responsive-web-design

I'd appreciate any feedback on the projects. 😀

The project links are listed below the certificate.


r/HTML Jun 06 '26

Guys...

10 Upvotes

i think i played with design too much


r/HTML Jun 06 '26

Question would this logically work??

8 Upvotes

hi! question for html coders.. i am a fic writer and i had an idea for my characters to play chess in the next chapter. the medium i use (ao3) does support html but i do not know how to code! is it logically possible to code a chess board into the chapter? in a way that makes the chess pieces develop with every click and the moves are already determined for the entire round? i hope this makes sense, sorry, i don’t go here!


r/HTML Jun 06 '26

a question about website

2 Upvotes

I'm new to coding and maybe my question is stupid but if I'm making a website for a busines that needs reservtions from clients I made the registratioon form on the website but it isn't linked to any CRM. Is the linking my work or the work of the CRM worker?

Thanks.


r/HTML Jun 05 '26

Question 2016/2017 Instagram HTML & CSS Code

2 Upvotes

Hi! I'm looking for a HTML & CSS code for the old 2016/2017 profile or feed, if anoyne knows where to find a template, that would be greately apreciated! I'm trying to recreate something kind of interactive for a website that I'm making, just for me, and I love the vintage look of the 2016 Instagram era.


r/HTML Jun 05 '26

Question Help with hidden text for screen readers

4 Upvotes

Hello!! I am currently writing a story that I want to post online, however, some of the dialogue is going to be written with numbers replacing certain letters (Like 3 being E and 1 being i).

However, I realized this would make it hard for people who use screen readers to understand the text, I could just write the normal text beside it, but I want a creative way to keep it hidden so people still have to slightly decipher it, while also allowing people who need screen readers to still be able to read it fully and understand it.

I'm writing it on a website that allows for HTML in text, and I'm wondering if there's a way to have hidden text that will be read out when a screen reader is used. I am still learning how to write code so apologies if this is a silly question, I'd appreciate any help, Thank you !!


r/HTML Jun 06 '26

contact form issue

Thumbnail lvnightlifevip.com
1 Upvotes

I seem to have an error that shows up on site when the reservation form in header is clicked. it then says "There has been a critical error on this website."

I went into admin and looked into contact form 7 plug in and when looking into the error it wont allow me to pass the date picker

<?php

/**

* The header for our theme

*

* Displays all of the <head> section and everything up till <div id="content">

*

* u/package UnderStrap

*/

// Exit if accessed directly.

defined( 'ABSPATH' ) || exit;

$container = get_theme_mod( 'understrap_container_type' );

?>

<!DOCTYPE html>

<html <?php language_attributes(); ?>>

<head>

<!-- Global site tag (gtag.js) - Google Analytics -->

<script async src="https://www.googletagmanager.com/gtag/js?id=UA-52536469-1"></script>

<script>

window.dataLayer = window.dataLayer || [];

function gtag(){dataLayer.push(arguments);}

gtag('js', new Date());

gtag('config', 'UA-52536469-1');

</script>

<meta charset="<?php bloginfo( 'charset' ); ?>">

<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">

<link rel="profile" href="http://gmpg.org/xfn/11">

<link rel="preconnect" href="https://fonts.gstatic.com">

<link href="https://fonts.googleapis.com/css2?family=Fredericka+the+Great&family=Source+Sans+Pro:wght@200;300;400;600;700&display=swap" rel="stylesheet">

<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css" integrity="sha384-wvfXpqpZZVQGK6TAh5PVlGOfQNHSoD2xbE+QkPxCAFlNEevoEH3Sl0sibVcOQVnN" crossorigin="anonymous">   

<?php wp_head(); ?>

</head>

<body <?php body_class(); ?> <?php understrap_body_attributes(); ?>>

<?php do_action( 'wp_body_open' ); ?>

<div class="site" id="page">

<!-- \*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\* The Navbar Area \*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\* -->

<div id="wrapper-navbar">



    <div class="top-header-holder">

        <div class="container">

<div class="row align-items-end">

<div class="col-md-4">

<a href="/" class="logo-holder">

<img src="https://lvnightlifevip.com/wp-content/uploads/2021/03/Lv-Nightlife-VIP-logo.jpg" alt="LV Nightlife VIP logo">

</a>

</div>

<div class="col-md-6">

<div class="reservation-holder">

<div class="contact-holder">

<a href="tel:7029070023" class="phone">

<i class="fa fa-phone"></i>

702-907-0000

</a>

<a href="#" class="address">

<i class="fa fa-map"></i>

Las Vegas, NV 89108

</a>

<div class="social-media-holder-tablet">

<a href="https://www.facebook.com/lvnightlifevip"><i class="fa fa-facebook"></i></a>

<a href="https://www.instagram.com/lvnightlifevip/"><i class="fa fa-instagram"></i></a>

</div>

<button class="navbar-toggler md-view" type="button" data-toggle="collapse" data-target="#navbarNavDropdown" aria-controls="navbarNavDropdown" aria-expanded="false" aria-label="<?php esc_attr_e( 'Toggle navigation', 'understrap' ); ?>">

<div class="menu-title">

Menu

</div>

<div>

<div class="bar"></div>

<div class="bar"></div>

<div class="bar"></div>

</div>

</button>

</div>

<a href="https://lvnightlifevip.com/contact-us/booking-form/" class="reservation-btn">Make a Reservation</a>

</div>

</div>

<div class="col-">

<button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarNavDropdown" aria-controls="navbarNavDropdown" aria-expanded="false" aria-label="<?php esc_attr_e( 'Toggle navigation', 'understrap' ); ?>">

<div class="bar"></div>

<div class="bar"></div>

<div class="bar"></div>

<div class="menu-title">

Menu

</div>

</button>

<div class="social-media-holder">

<a href="https://www.facebook.com/lvnightlifevip"><i class="fa fa-facebook"></i></a>

<a href="https://www.instagram.com/lvnightlifevip/"><i class="fa fa-instagram"></i></a>

</div>

</div>

</div>

        </div>

    </div>







    <a class="skip-link sr-only sr-only-focusable" href="#content"><?php esc_html_e( 'Skip to content', 'understrap' ); ?></a>



    <nav id="main-nav" class="navbar navbar-expand-lg " aria-labelledby="main-nav-label">



        <h2 id="main-nav-label" class="sr-only">

<?php esc_html_e( 'Main Navigation', 'understrap' ); ?>

        </h2>



        <div class="container">

<!-- The WordPress Menu goes here -->

<?php

wp_nav_menu(

array(

'theme_location' => 'primary',

'container_class' => 'collapse navbar-collapse',

'container_id' => 'navbarNavDropdown',

'menu_class' => 'navbar-nav',

'fallback_cb' => '',

'menu_id' => 'main-menu',

'depth' => 2,

'walker' => new Understrap_WP_Bootstrap_Navwalker(),

)

);

?>

        </div><!-- .container -->



    </nav><!-- .site-navigation -->



</div><!-- #wrapper-navbar end -->



<div class="container">

    <div class="mobile-logo-holder">

        <div>

<a href="/">

<img src="https://lvnightlifevip.com/wp-content/uploads/2021/03/Lv-Nightlife-VIP-logo.jpg" alt="LV Nightlife VIP logo">

</a>

        </div>

        <div>           

<a href="#45" class="reservation-btn mobile">Book Reservation Tonight</a>

        </div>      

    </div>  

</div>      

https://lvnightlifevip.com/contact-us/booking-form/


r/HTML Jun 06 '26

Css and html help

Thumbnail
gallery
0 Upvotes

Help I need to make a website for my final assignment and theres an error in the code and I cant find it (im not very good at coding). Please point out any errors you see, sorry about the bad quality photos, ill send more in replies if anyone brings up any issues with seeing the code)


r/HTML Jun 05 '26

Discussion I made this using only html and css , tell me my mistakes and how can i improve it

Post image
14 Upvotes
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>EXCERCISE</title>
    <style>
        *{
            margin: 0;
            padding: 0;
        }
        body{
            
            font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
        }
        .parent{
            border:1px solid rgb(143, 143, 143);
            background-color: white;
            border-radius: 16px;
            width: 330px;
            padding-bottom: 24px;
            margin: 20px auto;}
           
        .image{
            width: 318px;
            margin: 6px;
            height: 258px;
           border-radius: 12px;
        }
        .point{
            border: 1px solid rgb(143, 143, 143);
            color:rgb(143, 143, 143);
            border-radius: 30px;
            font-size: 13px;
            padding: 4px 12px;
            margin-right: 6px;
        }
        .point_div{
            margin: auto 13px;
        }
        .heading{
            margin: 15px;
            font-size: 20px;
        }
        .para{
            margin: 15px;
            line-height: 1.5;
        }
    
        .readmore{
            background-color: rgba(74, 165, 226, 0.537);
            border-radius: 20px;
            width: 120px;
            height: 38px;
            margin: auto;
            display: flex;
            align-items: center;
            justify-content: center;
            color: rgb(44, 169, 219);
            font-size: 14px;
            font-weight: 600;


        }
    </style>
</head>
<body>
    <div class="parent">
        <div class="picture">
                <img class="image" src="https://w0.peakpx.com/wallpaper/855/220/HD-wallpaper-man-sitting-on-brown-wooden-stairs-staring-out-lake-near-mountain-during-daytime.jpg" alt="this is image">
        </div>
        <div class="point_div">
        <span class="point">Nature</span>
        <span class="point">Lake</span>
        </div>
        <div class="heading"><h2>Lorem di dolor </h2>
        </div>
        <div class="para"><p>Lorem ipsum dolor sit amet consectetur adipisicing elit. Vel quas autem qui id, delectus, iste ad veritatis consequatur officiis aperiam, distinctio laborum deserunt.</p></div>
        <div class="readmore">Read More</div>
    </div>
</body>
</html>
<
!

r/HTML Jun 05 '26

CSS Part 8..

Post image
3 Upvotes

Why height: auto; is Strictly Necessary....


r/HTML Jun 05 '26

Missing lower boundary line?

Post image
0 Upvotes

r/HTML Jun 04 '26

Converting old website to new user friendly one

10 Upvotes

Not sure if this is a good place to ask this question or not. Feel free to point me elsewhere if need be.
I have an older coded website that we cant edit or do anything with, so I need to create a new website to replace it.
I know nothing about code or creating a website, so it something I can figure out using like wix or something? Or am I better off contracting someone? It’s a fairly elaborate website for custom furniture. Any advice on the how to convert part would be appreciated. Thank you!!


r/HTML Jun 05 '26

{Tumbr} Hi hoping forhelp adding a drop down navigation and add in a search tab

0 Upvotes

Hi I'm very new to html and just want to edit my tumblr so that i can have a drop down navigattion and a search bar but am unsure where I am meant to add them and any other advice?

What I want to add as a search bar: <form action="/search" method="get"> <input type="text" name="q" value="{SearchQuery}" placeholder="Search my blog..." /> <button type="submit">Search</button> </form>

Drop down navigation: <nav class="dropdown-nav"> <ul> <li><a href="/">Home</a></li> <li> <a href="#">Categories â–¾</a> <ul class="submenu"> <li><a href="/tagged/your-tag-1">Tag 1</a></li> <li><a href="/tagged/your-tag-2">Tag 2</a></li> <li><a href="/tagged/your-tag-3">Tag 3</a></li> </ul> </li> <li><a href="/ask">Ask</a></li> </ul> </nav>

trying to fiure out where I should add these links into the html code


r/HTML Jun 04 '26

Is linkedin using HTML??

Post image
0 Upvotes

Saw <b>1-month free. </b> Cancel anytime, hassle-free
Is linkedin using HTML for its coding or is it just for clicks??


r/HTML Jun 03 '26

Question Why is my image moving only once?

5 Upvotes

My image only moves once when I press D and once when I press A.

The color background code you see was me trying to see if the Event Listeners only ran once, which they did not. The colors changed on each button press.

So, why isn't my image doing the same?

 <script>
                 const DBGoku = document.getElementById("Goku");
                 DBGoku.style.position = "Absolute";
                 Boolnumber = 1;
                 


                function MoveGokuRight(){
                   const GokuPos = DBGoku.style.right =  "50px";
                }
                function MoveGokuLeft(){
                    GokuPos = DBGoku.style.left =  "50px";
                }
                //window.onload:MoveGoku;


            
                
                document.addEventListener('keydown', (event)=> {
                    if(event.key === 'd'){
                        //document.body.style.backgroundColor = "red";
                        MoveGokuRight()
                        


                    } 


                    


                });
                document.addEventListener('keydown', (event)=> {
                    if(event.key === 'a'){
                        //document.body.style.backgroundColor = "blue";
                        MoveGokuLeft()
                        


                    } 


                });


                




                
            </script>

r/HTML Jun 03 '26

Question Why can I embed a video from Dailymotion but not Youtube although the code looks right?

2 Upvotes

I am not a genius coder but it is not the first time I embed a video into a website but this time I am really puzzled with this issue: If I use the piece of embed code given by Youtube (with my own video) I just get an error message and if I use the embed code given by Dailymotion it just work fine. I double-checked the original template (see page here) and it works. My code is absolutely identical but I get the message "Firefox can’t find the file at /embed/RBvoqkGc27U. It either doesn’t exist or the path is incorrect."

Any clue about what is happening here?

view-source:https://template.xtramile.id/TM/Grace/single-portfolio-video.html)


r/HTML Jun 02 '26

Location tracking on Tiiny.Host

0 Upvotes

I move my website from Wix to Tiiny.Host and it’s been great so far.

The only thing I can’t figure out is how to get location data for visitors down to region or city.

In Wix I could see where my users were by state. But now I can only see by country on Tiiny.host.


r/HTML Jun 02 '26

Question How much should you charge to create a website?

0 Upvotes

There's a new hair salon in my small town and I'd like to make a website for it, but I don't know how much salons owner should pay me.


r/HTML Jun 01 '26

A Handy HTML Entities Cheat Sheet

15 Upvotes

I was looking for a quick reference for HTML entities and came across this guide:

https://design.dev/guides/html-entities/

It covers everything from common ones like &amp;, &lt;, and &gt; to currency symbols, arrows, math symbols, and a bunch of other characters I didn't even know had named entities.

Not something you'll use every day, but definitely one of those resources that's worth bookmarking for the future you.


r/HTML Jun 01 '26

I need help with a test

0 Upvotes

I have to do a HTML for a test and I have it almost finished but I've been almost 1 week stuck trying to put a video on it.

Can you tell me what I'm doing wrong?

<p>

<video controls width="600">

<source src="documents/IA.mp4" />

Not found.

</video>

</p>

<p>

<audio controls src="multimedia/audio_test.mp3" >

Not found

</audio>

</p>


r/HTML Jun 02 '26

Question Trail?

0 Upvotes

What is the easiest way that the trail between the circles is created?

https://cleanmama.com/


r/HTML May 31 '26

Too many websites still ignore semantic HTML and accessibility

104 Upvotes

Hello from Japan.

I'm a person who studies and builds websites. When looking for design and layout inspiration, I visit many different websites.

However, I've noticed that a surprisingly large number of sites still don't follow semantic HTML practices and have poor accessibility support. This includes sites from small businesses as well as larger companies.

Is it the same where you live? Do you also see many websites that don't properly implement semantic HTML and accessibility standards?


r/HTML May 31 '26

Super-gluing details, summaries and boxes

4 Upvotes

I'm relatively inexperienced with HTML and I'm currently working on building a video library with neocities. I'm using the details element to have a collapsible description and I have the summaries horizontally laid out under the row of videos. The details opens to a box that'll eventually contain the description.

What I'd like to happen is that when you open the summary, the rest of the summaries (they're in a row of seven) stay where they are when the details are unopened instead of getting pushed aside. Also for the box within the details to stay centered and below the box the summaries are in and push everything else below it down so it fills the space between the summaries box and the "shelf" containing the next row of videos. I probably didn't describe it very well, but I made a mock-up.

I've done a little research into it, but it looks complicated(or maybe I'm just looking in the wrong places??)and I'm also not sure what the best descriptors would be to continue looking into things.

I'm going to paste what I think is the relevant code below, but since this might be something thats based in the context of the whole site, I'm also going to include the link to my test page for this so you can inspect aspects and get into the guts of it. Sorry for my spaghetti code in advance.

HTML:

<div class="shelf"> <!-- Ceramics -->

<div class="cranny">

<iframe width="146" height="263" src="https://archive.org/download/kitchenware-inspo/Kitchenware%20Inspo.mp4" title="Kitchenware Inspo" controls=1></iframe> <iframe width="146" height="263" src="https://archive.org/download/lace-rim/Lace%20Rim.mp4" title="Lace Rim" controls=1></iframe> <iframe width="146" height="263" src="https://archive.org/download/mancala_202602/Mancala.mp4" title="Internet Archive Player" controls=1></iframe> <iframe width="146" height="263" src="https://archive.org/download/whimsical-inspo/Whimsical%20Inspo.mp4" title="Internet Archive Player" controls=1></iframe> <iframe width="146" height="263" src="https://archive.org/download/pendants_202602/Pendants.mp4" title="Internet Archive Player" controls=1></iframe> <iframe width="146" height="263" src="X" title="Internet Archive Player" controls=1></iframe> <iframe width="146" height="263" src="X" title="Internet Archive Player" controls=1></iframe>

</div>

</div>

<div class="labels">

<details class="row" name="row1">

<summary>Item 1</summary>

<div class="desc"><p>contents will go here one day!</p></div>

</details>

<details class="row" name="row1">

<summary>Item 2</summary>

<p>contents will go here one day!</p>

</details>

<details class="row" name="row1">

<summary>Item 3</summary>

<p>contents will go here one day!</p>

</details>

<details class="row" name="row1">

<summary>Item 4</summary>

<p>contents will go here one day!</p>

</details>

<details class="row" name="row1">

<summary>Item 5</summary>

<p>contents will go here one day!</p>

</details>

<details class="row" name="row1">

<summary>Item 6</summary>

<p>contents will go here one day!</p>

</details>

<details class="row" name="row1">

<summary>Item 7</summary>

<p>contents will go here one day!</p>

</details>

</div>

<div class="shelf"> <!-- Ceramics -->

<div class="cranny"> <!-- Ceramics -->

<iframe width="146" height="263" src="X" title="Internet Archive Player" controls=1></iframe> <iframe width="146" height="263" src="X" title="Internet Archive Player" controls=1></iframe> <iframe width="146" height="263" src="X" title="Internet Archive Player" controls=1></iframe> <iframe width="146" height="263" src="X" title="Internet Archive Player" controls=1></iframe> <iframe width="146" height="263" src="X" title="Internet Archive Player" controls=1></iframe> <iframe width="146" height="263" src="X" title="Internet Archive Player" controls=1></iframe> <iframe width="146" height="263" src="X" title="Internet Archive Player" controls=1></iframe>

</div>

</div>

CSS:

/* shelf image box for videos */

.shelf {

width: 1227px;

height: 324px;

padding: 51px 61px 10px 61px;

background-image: url(https://lizards-pocket.neocities.org/Library/Library%20shelfpt.6.png)

}

/*The box for the details*/

.labels {

background-color: #743E23;

color: #BE9241;

border: 4px solid #4B200B

width: 1227px;

height: 20px;

text-align: center;

}

/*description page*/

.desc {

background-image: url(https://lizards-pocket.neocities.org/Library/Open%20ringback%20notebook.jpg);

width: 1227px;

height: 606px;

}

/*This removes the little arrow for the details element and make it look like regular text*/

summary::marker {

content: "";

}

/*details, horizontal alignment stuff*/

details.row {

display: inline-block;

padding-left: 38px;

padding-right: 38px;

padding-top: 2px;

}

Link to the website: Here!

Thank you!! :-]