Submitted almost 3 years ago

HTML, SCSS (flexboxes), vanilla JS

Sean• 175

@sean-b765

Preview site View code

This is a solution for...

Tip calculator app

HTML
CSS
JS

2junior

View challenge

Design comparison

SolutionDesign

Solution retrospective

Hey all :) This is my first time trying one of these. Would appreciate any feedback on my styling. I always use flex and haven't looked into grid yet. Thanks

Community feedback

Chamu• 12,970

@ChamuMutezva

Posted almost 3 years ago

a div should not be a child of a label
a label must not have more than one button/input as children
a form element was proper to wrap the inputs and buttons
images must have an alt attribute

Marked as helpful

Sean• 175

@sean-b765

Posted almost 3 years ago

@ChamuMutezva Thanks mate

Elijah Ohiwerei• 150

@Thenextgen1

Posted almost 3 years ago

Here's what you can do Use a display of grid for the buttons Manipulate the grid template columns for desktop and mobile Then reduce the width and use a position of relative to reposition some members of the button Also for your reset button After listening for a click event Set the values of the input custom and persons to an empty string"" and equate to inner html or text

Sean• 175

@sean-b765

Posted almost 3 years ago

@Thenextgen1 Thanks - I'll look into grid for that section. Also the reset button works on my end, all inputs/variables are set back to their defaults

Please log in to post a comment

Join 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