Skip to content
  • Unlock Pro
  • Log in with GitHub
Profile
OverviewSolutions
12
Comments
2

EcePJD

@EcePJDCamaligan, Camarines Sur, Bicol, Philippines200 points

I am a licensed Electronics Engineer that is passionate for technologies. I love coding and have focused interests in Robotics, Artificial Intelligence, Machine Learning, Circuit / Device Designing and Software Development.

Latest solutions

  • Social Proof Section using CSS FlexBox


    EcePJD•200
    Submitted about 2 years ago

    0 comments
  • Stats Preview Card Component using CSS FlexBox


    EcePJD•200
    Submitted about 2 years ago

    0 comments
  • Order Summary Component using CSS FlexBox


    EcePJD•200
    Submitted about 2 years ago

    1 comment
  • 3 Column Preview Card using CSS FlexBox


    EcePJD•200
    Submitted about 2 years ago

    0 comments
  • NFT Preview Card Component using CSS Flexbox


    EcePJD•200
    Submitted about 2 years ago

    1 comment
  • Rock Paper Scissors Game using CSS FlexBox and JS DOM Manipulation


    EcePJD•200
    Submitted about 2 years ago

    0 comments
View more solutions

Latest comments

  • Alessio Valastro•190
    @AlessioValastro
    Submitted over 2 years ago

    Responsive - Product - Card

    3
    EcePJD•200
    @EcePJD
    Posted over 2 years ago

    First of all, you can update your solution in the 'Design Comparison' by clicking the 'Generate New Screenshot' (Red - Pinkish button). Second, I didn't see the horizontal scroll bar on your solution (you might've fixed it already).

    Child elements overflow because the overall width / height ( or both) they occupy is more than the width / height of the container resulting to a scroll bar. Based on my experience, even though you set the width and height of these child elements to equal or less than the container's size by using parent-dependent units ( e.g.percentage '%') and the parent element does not have a specified size, it will not apply. You must specify your parent element's size first (e.g. px).

    If incase my analysist about child elements are wrong and you still did not figure how the scroll bar is appearing, you can hide it by setting the parent's overflow attribute to 'hidden'.

    Reference: (overflow)https://www.w3schools.com/css/css_overflow.asp

    Marked as helpful
  • eve•270
    @Eve-Wangari
    Submitted over 2 years ago

    JavaScript rating component

    1
    EcePJD•200
    @EcePJD
    Posted over 2 years ago

    You can disable the button using the 'disabled' attribute

    You can use this js code to add disabled attribute: document.getElementById("submitButtonId").disabled = true;

    And add an event listener function that detects the selection change of the selected option value (the rating 1 - 5). Inside that function add a condition that if the value is higher than 0 ( or any condition you know that is better that what i say :) ) it sets the disabled attribute to false: document.getElementById("submitButtonId").disabled = false;

    Reference:

    (disabled attribute) https://www.w3schools.com/tags/att_disabled.asp

    (onchange event listener)https://www.w3schools.com/jsref/event_onchange.asp

    Marked as helpful
Frontend Mentor logo

Stay up to datewith new challenges, featured solutions, selected articles, and our latest news

Frontend Mentor

  • Unlock Pro
  • Contact us
  • FAQs
  • Become a partner

Explore

  • Learning paths
  • Challenges
  • Solutions
  • Articles

Community

  • Discord
  • Guidelines

For companies

  • Hire developers
  • Train developers
© Frontend Mentor 2019 - 2025
  • Terms
  • Cookie Policy
  • Privacy Policy
  • License

Oops! 😬

You need to be logged in before you can do that.

Log in with GitHub

Oops! 😬

You need to be logged in before you can do that.

Log in with GitHub

Oops! 😬

You need to be logged in before you can do that.

Log in with GitHub

Oops! 😬

You need to be logged in before you can do that.

Log in with GitHub

Oops! 😬

You need to be logged in before you can do that.

Log in with GitHub

Oops! 😬

You need to be logged in before you can do that.

Log in with GitHub

Oops! 😬

You need to be logged in before you can do that.

Log in with GitHub

Oops! 😬

You need to be logged in before you can do that.

Log in with GitHub

Oops! 😬

You need to be logged in before you can do that.

Log in with GitHub

Oops! 😬

You need to be logged in before you can do that.

Log in with GitHub

Oops! 😬

You need to be logged in before you can do that.

Log in with GitHub

Oops! 😬

You need to be logged in before you can do that.

Log in with GitHub

Oops! 😬

You need to be logged in before you can do that.

Log in with GitHub

Oops! 😬

You need to be logged in before you can do that.

Log in with GitHub

Oops! 😬

You need to be logged in before you can do that.

Log in with GitHub

Oops! 😬

You need to be logged in before you can do that.

Log in with GitHub

Oops! 😬

You need to be logged in before you can do that.

Log in with GitHub

Oops! 😬

You need to be logged in before you can do that.

Log in with GitHub

Oops! 😬

You need to be logged in before you can do that.

Log in with GitHub