Space between image and <h2>

HTML-CSS
1

Hi, I am working on my portfolio, and I can not remove the space between h2 and image. Space will appear in the @media screen and (min-width: 481px) and (max-width:768px). I try to add, float: left or right, display: block, change margin and padding, but space is still there.
This is my link https://codepen.io/Kijimu7/project/editor/ZJGPwE

Thank you in advance.

2

Your .box1 has two widths: width: 300px and width: 100%. Try to encompass all the boxes into one large

, then set
to width: 100% and boxes inside it to widths: 30%. Or, you can simply change all the boxes’ widths to width: 30% , without setting any pixel value. I hope it will work.
3

Thank you for your reply. I want to make box 1 bigger than other boxes. So, set box1, box2, box3, box4{
width: 300px;}
box1{
width: 50%;
}
box2,box3,box4{
30%;
}
like this?

4

You know, if you set two width characteristics for one block, your code will deliver a mistake. You better ignore the block you want to make bigger than other ones when you do box2, box3, box4{width: 300px;} and then set box1{width: 350px;}. If you want to have a responsive page you better do some “@media screen” code after setting those widths. I hope that helps.:grinning: