Responsive image inside div

[ZorroX]

I want to put a small shop image into my div box which is top of the side bar. The problem is after I set margin, height etc. it is not responsive like the rest of my site and its dissapear after i change windows size. I've created two divs one inside another to fit my 1300px container div width. 

Edited July 10, 2018 by ZorroX

[dsonesuk]

If you have a problem with your car, would you show the mechanics only a picture of the car or bring them the car so they can inspect it and identify the problem.

[ZorroX]

Here I am changing the size of my web page holding mouse button and drag right side to the left. This small black shop icon is starting to hide on the right side. Grey div box element is responsive like the menu elements below but not this little image.

Css commands used:

height: 20px;
width: 20px;
display: box;
 margin: 5px 5px 0 1200px;

Edited July 10, 2018 by ZorroX

[dsonesuk]

Obviously the left fixed margin length of 1200px will push it out beyond the boundary of browser window when its width starts getting below: 1200px, so you will have to try alternative to using this massive left margin. Again! image is useless in determining to html structure and styling used, its basically gone from a image to a video being supplied to a mechanic to fix a problem.

Supply code html/css or a link to this page is a much better option than a image.

[ZorroX]

HTML code: https://drive.google.com/open?id=1C8RgBwyAYhQECdAnZvHwZwrg5iryoaB0

CSS code: https://drive.google.com/open?id=1PMOZMtoYaXL0Cgzr71LCFnsArgWdkBSN

[dsonesuk]

To be responsive, you shouldn't us a fixed width using px, unless you use media queries to adjust width and html content structure as the device increases or decreases. You are using max-width: on wrapper div, which makes this element responsive up to a specific max-width. Most responsive sites use percentages widths for inner html structure within the fixed width container element, these also will use media queries to change from 3 to 2 to a 1 single column structure for mobile devices. Once this responsive page is working as it should, you can then think about adding all the other features like shopping cart images etc.