I am facing a challenge with arranging child divs inside a parent div that has a specific width. Even though I am using isotope to arrange them, the layout modes do not work well for me in terms of spacing.
My goal is to have the child divs fill the space of the parent without any gaps on the far right, while also having margins and padding set for each div. Currently, things are looking decent, as shown here:
Although the margin on the right and top of each div is correct, my aim is to eliminate the margin on the last items of each row. The tricky part is that some divs have varying widths. It should align at the same point as the top-right box, as seen in the image.
The CSS I utilized is as follows:
.global-post{
padding: 0;
height: 400px;
float: none;
display: inline-block;
*display: inline;
zoom: 1;
vertical-align: top;
width: 308px;
}
This code sets the width for narrower items, while wider projects have different width values.
Is there anyone who can provide me with guidance on how to resolve this issue?