Welcome!

By registering with us, you'll be able to discuss, share and private message with other members of our community.

SignUp Now!

Search results

  1. H

    Grid item with aspect-ratio

    @Jo Thank you so much for your response! Here is a screenshot of what I want to achieve: The first grid item is an image, and the second is text. I called the second one 'dominant' because I want it to dictate the height of the grid item, and I want the image to be an square image. So as...
  2. H

    Grid item with aspect-ratio

    Hello there! The problem I want to solve is in this codepen: https://codepen.io/hebrerillo/pen/rNbLXaR As you can see, the second grid item overlaps the first item, even though the first item has a specific width and height. Why?? Thank you so much!
  3. H

    Sass class with class specification using BEM

    Hello there! What I am going to ask is probably very easy, but I did not manage to get it even after so much search. This is the HTML: <form class='form-component'> <div class='form-component__row'></div> <div class='form-component__row...
  4. H

    JavaScript Can't read newURL property on Event in TypeScript

    Hello there! I am trying to catch the 'onHashChange' event in TypeScript and to work with the new URL. Here is the code: window.addEventListener('hashchange', function(event: HashChangeEvent) { console.log(event); }); However, the compiler gives this error: No overload matches...
  5. H

    HTML & CSS Can't center a grid item with a max-width

    Hello OldMan! Here is the entire code: <!DOCTYPE html> <html> <head> <style> .container { display: grid; height: 300px; background-color: antiquewhite; align-items: end; } .item {...
  6. H

    HTML & CSS Can't center a grid item with a max-width

    Hello Menator, I came up with a solution: https://codepen.io/hebrerillo/pen/xxWYvqZ But I am still wondering why grid items with a maximum width cannot be centered...
  7. H

    HTML & CSS Can't center a grid item with a max-width

    Hello Menator! Thanks for your answer ;) I want the grid item to be flexible and to not go beyond 1400px. That is why I want it to have a maximum width of 1400px. Here is a codepen example of what I want to achieve: https://codepen.io/hebrerillo/pen/rNvNPRo
  8. H

    HTML & CSS Can't center a grid item with a max-width

    Really? I tried the code with updated versions of Firefox and Chrome and the grid item is shrink, it does not grow to 1400px
  9. H

    HTML & CSS Can't center a grid item with a max-width

    Hello there! I want to center a grid item that has a max-width but the item is not centered. Here is a code example: <!DOCTYPE html> <html> <head> <style> .container { display: grid; grid-template-columns: 1fr; height...
  10. H

    Contribute to an open source web project

    Hello there! I would like to participate in a web project to improve my front end programming skills in HTML, CSS and Vanilla JavaScript. Could you please tell me or guide me how can I contribute to a free web project? I searched on the net but could not find anything. Thanks a lot!
  11. H

    HTML & CSS input field does not respect flexbox layout

    Another solution is to wrap the input inside a container. I found this codepen implementing both solutions: https://codepen.io/regic/pen/pyyKbd How can I close this thread as solved?
  12. H

    HTML & CSS input field does not respect flexbox layout

    Hello BGB... I am kind of shocked... If I set a width to the '.input-grow' element now it works... <html> <head> <style> .flex-container { width: 400px; height: 200px; border: 1px solid black; display...
  13. H

    HTML & CSS input field does not respect flexbox layout

    Hello there! I need help! Why is the input growing so much that it overflows the flex container? However, if you comment the input and remove the comment on the '.div-grow' element, this one respects the flexbox layout. In fact, if the 'flex-grow:1' is removed form the input, it still grows so...

About Us

Code Forum is a community platform where coding enthusiasts can connect with other developers, engage in discussions, ask for help, and share their knowledge with a supportive community. It's a perfect place to improve your coding skills and to find a community of like-minded individuals who share your passion for coding.

Site links

Stay Connected

Back
Top Bottom