Responsive newsletter project using HTML,CSS and JAVASCRIPT
Design comparison
Solution retrospective
1.Well I'm having a issue in the desktop design. Whenever the user clicks on the input button all the CSS design breaks.
Is this because I've used percentage value instead of px or something else?
Any idea?
- Also in the confirmation message I couldn't figure out how to add the email (that any user will give in the input section ) in the html section.
What's the best way to solve that?
Community feedback
- @ShyneADLPosted about 1 year ago
- Use more pixels than percentages because % are relative units that changes depending on the width/height of the wrapping div/screen.
To add the email to the success paragraph you can use this little code snippet in your js file
function convertToParagraph() { // Get the value of the input data from the input element with Id 'text' var inputData = document.getElementById("text").value; // Create a new paragraph element var paragraph = document.createElement("p"); // Set the text content of the paragraph element to the input data paragraph.textContent = inputData; // Get the span element where you want to add the email to var outputEmail= document.getElementById("outputEmail"); // Clear any existing content in the output paragraph outputParagraph.innerHTML = ""; // Append the new paragraph to the output paragraph element outputParagraph.appendChild(paragraph); }
This should work for you.
0 - @alihaghjouPosted about 1 year ago
Hello, I really liked your solution since you used vanilla js. For the question you asked about passing the value i think the best way to use url query just simply set the query string to the value and use it when the href of the page is changed.
0
Please log in to post a comment
Log in with GitHubJoin our Discord community
Join thousands of Frontend Mentor community members taking the challenges, sharing resources, helping each other, and chatting about all things front-end!
Join our Discord