Tag: html-table

How to lay an image over an image in table cell

Advertisements I’m trying to lay an image on top of an image in a table cell (if you click on it). <table> <tr> <td style="background-color:Gray;"><a id="firstcell" onclick="addImage"><img scr="snowman.png"></a></td> </tr> … </table> Here is the addImage function: function showMoves(fig_name,pos) { var image = document.createElement("img"); var imageParent = document.getElementById("firstcell"); image.src = "circle.png"; image.style.position = "absolute"; imageParent.appendChild(image); }… Read More How to lay an image over an image in table cell

MRLeave a comment

Why all <tr> go in <thead> after calling a createTHead

Advertisements I have a question regarding this code: const table = document.createElement("TABLE"); const thead = table.createTHead(); const tr = thead.insertRow(); const th1 = tr.insertCell(); th1.textContent = "header1"; const th2 = tr.insertCell(); th2.textContent = "header2"; const tr2 = table.insertRow(); const td1= tr2.insertCell(); td1.textContent = "field1"; const td2 = tr2.insertCell(); td2.textContent = "field2"; document.getElementById("main").appendChild(table); All rows insert… Read More Why all <tr> go in <thead> after calling a createTHead

MRLeave a comment

Browser adds a mysterious <td></td> at the end of one table row

Advertisements This is my simplified code: <head> <style> table { border-collapse: collapse; width: 100%;} table td { padding-right: 15px; padding-left: 15 px; background-color: beige; border: none; } table td:first-child { text-align: left; } table tr td { vertical-align: middle; } table#legendtable td { font-size: x-small; padding: none; text-align: center; width: 5%; border: 1px solid black;… Read More Browser adds a mysterious <td></td> at the end of one table row

MRLeave a comment

How the change the value of a td with an input outside the table when clicking button

Advertisements Let’s say I have an input inside a form with a button: <body> <form class="contact-form" id="my_rec" name="my_rec"> <div class="container"> <div class="row"> <div class="col-sm-2"> <label for="TESTIMATED" class="col-form-label" style="font-size:10px;font-style:aril;font-weight:bold;text-align:right;color:blue;font-family:arial"><b>ESTIMATED COST:</b></label> <p><input type="number" style="font-size:10px" class="form-control" id="TESTIMATED" name="TESTIMATED" value="0.00"></p> <button name="btn2" type="button" class="btn btn-secondary" id="btn2">Close REC</button> </div> </div> </div> </form> </body> And after the form I have a… Read More How the change the value of a td with an input outside the table when clicking button

MRLeave a comment

Why is the vertical alignment of my html button in a <td> lost when I add an image?

Advertisements I have buttons where I have normally added just text. In this way the vert. alignment of the buttons in the <td> is ok.(Code-1). But when I add also an image to the button, then the alignment of the button is lost.The <td> height gets higher and the button is aligned to the bottom.… Read More Why is the vertical alignment of my html button in a <td> lost when I add an image?

MRLeave a comment