All solutions

What specific areas of your project would you like help with?

I would like to know why there is a horizontal scroll in the cellular version, comment the code and the error is generated in the first div, in the

##line 23##
 
            Preparation time

            
                
                    
                    Total: Approximately 10 minutes
                
                
                    
                    Preparation: 5 minutes
                
                
                    
                    Cooking: 5 minutes
                
            
        

I know that the challenge was only with HTML and CSS but I wanted to implement reading the .json file with ajax, since they provide us with the plugins file to use it.

I appreciate if you give me any suggestions for improvement :D

Difficulty encountered I find it difficult to maintain the height of the background image when the web window shrinks The solution I found was to give it a height of 46%, but I think it is not the best solution

I would appreciate if you could help me with the height of the image My solution

I would also appreciate if you could clarify the following for me To make a website responsive you have to use media queries, is this a good use? or is there another better option? (Is it frowned upon to use media queries?)

styles.css


LINE 19:

     body {
         background-size: auto 46%;
}


LINE 95:
@media(max-width:375px) {
     body {
         background-image: url('./images/background-pattern-mobile.svg');
         background-size: auto 46%;
     }
}