tittle at center and background text become red, please help |
tittle at center and background text become red, please help |
choy96 |
Mar 30 2023, 02:14 AM
Post
#1
|
Group: Members Posts: 4 Joined: 21-October 21 Member No.: 28,150 |
i have the html code to make a counter with google form by chatgpt, but i can't make the tittle move to center and the counter text background make become red. picture as below is i going to make it be.
https://farmstatus.blogspot.com/2023/03/blog-post.html html i was using now is below <!DOCTYPE html> <html> <head> <meta name="viewport" content="width=device-width, initial-scale=1"> <title>Countdown Timer with Google Form</title> <script> // Set the date we're counting down to var countDownDate = new Date("April 1, 2023 00:00:00").getTime(); // Update the countdown every 1 second var x = setInterval(function() { // Get the current date and time var now = new Date().getTime(); // Calculate the time remaining var timeLeft = countDownDate - now; // Calculate days, hours, minutes and seconds left var days = Math.floor(timeLeft / (1000 * 60 * 60 * 24)); var hours = Math.floor((timeLeft % (1000 * 60 * 60 * 24)) / (1000 * 60 * 60)); var minutes = Math.floor((timeLeft % (1000 * 60 * 60)) / (1000 * 60)); var seconds = Math.floor((timeLeft % (1000 * 60)) / 1000); // Display the countdown in an HTML element document.getElementById("countdown").innerHTML = days + "d " + hours + "h " + minutes + "m " + seconds + "s "; // If the countdown is finished, display a message if (timeLeft < 0) { clearInterval(x); document.getElementById("countdown").innerHTML = "EXPIRED"; } }, 1000); </script> </head> <body> <h1>Countdown Timer</h1> <p>Countdown to April 1, 2023:</p> <p id="countdown"></p> <!-- Google Form Embed Code --> <iframe src="https://docs.google.com/forms/d/e/1FAIpQLSd8ahWie_F2H3S5wfi3q9yTR8u4oJQzXdK7dOx4xneKt6PZeg/viewform?embedded=true" width="640" height="1418" frameborder="0" marginheight="0" marginwidth="0">Loading…</iframe> <!-- Replace the "src" URL with the URL of your own Google Form. --> <!-- Script to fill in name, company name, contact number, and email address --> <script> document.addEventListener('DOMContentLoaded', function() { document.getElementById('entry.XXXXXXXX').value = 'John Doe'; // Replace 'entry.XXXXXXXX' with the ID of the name field in your Google Form, and 'John Doe' with the default name. document.getElementById('entry.XXXXXXXX').value = 'ABC Company'; // Replace 'entry.XXXXXXXX' with the ID of the company name field in your Google Form, and 'ABC Company' with the default company name. document.getElementById('entry.XXXXXXXX').value = '1234567890'; // Replace 'entry.XXXXXXXX' with the ID of the contact number field in your Google Form, and '1234567890' with the default contact number. document.getElementById('entry.XXXXXXXX').value = 'johndoe@example.com'; // Replace 'entry.XXXXXXXX' with the ID of the email address field in your Google Form, and 'johndoe@example.com' with the default email address. }); </script> </body> </html> Please help, thanks in advance. This post has been edited by choy96: Mar 30 2023, 02:21 AM |
coothead |
Mar 30 2023, 04:52 AM
Post
#2
|
Advanced Member Group: Members Posts: 206 Joined: 12-January 23 From: chertsey, a small town 25 miles south west of london, england Member No.: 28,743 |
Hi there choy96,
add this to the head section of the document... CODE <style media="screen"> h1, p { text-align: center; } #countdown { width: 11em; padding: 0.4em; margin: auto; background-color: #f00; font-size: 1.25em; font-weight: bold; } iframe { display: block; margin: auto; } </style> coothead |
coothead |
Mar 30 2023, 10:31 AM
Post
#3
|
Advanced Member Group: Members Posts: 206 Joined: 12-January 23 From: chertsey, a small town 25 miles south west of london, england Member No.: 28,743 |
Hi there choy96,
if you're interested, check out this attachment... choy96.zip ( 2.3k ) Number of downloads: 70 ...I've tidied up your page somewhat. coothead |
choy96 |
Mar 31 2023, 02:31 AM
Post
#4
|
Group: Members Posts: 4 Joined: 21-October 21 Member No.: 28,150 |
awosome ! straight copy your zip file then can use it, very good . thanks very much
This post has been edited by choy96: Mar 31 2023, 02:32 AM |
coothead |
Mar 31 2023, 03:13 AM
Post
#5
|
Advanced Member Group: Members Posts: 206 Joined: 12-January 23 From: chertsey, a small town 25 miles south west of london, england Member No.: 28,743 |
No problem, you're very welcome. coothead |
Lo-Fi Version | Time is now: 13th May 2024 - 03:56 AM |