Managing the size of the dom items

AlexanderLamas

Hi guys,

I'm trying to customize the size of the items at the dom, at the moment and I'm using this.

dom: "<'row'<'col-sm-2'l><'col-sm-4'B><'col-sm-6'f>><'row'<'col-sm-12'tr>><'row'<'col-sm-5'i><'col-sm-7'p>>",

But, when I use lower resolution, for example, 1024x768, the middle column of the first line

<'col-sm-4'B>

overlap a bit the left column.

I've seen some samples using

.dataTables_length {
    margin-right: 1em;
}

but, it doesn't work in my case because I'm using bootstrap col-sm-2.

The good thing about using bootstrap in this is because it aligns properly the column on the left and the column on the right nicely, but the middle column get shifted around when changing the resolution and end up overlapping the left column.

Also, bootstrap does not have half size column classes, so, I'm a bit stuck there.

Any ideas how can I manage that and don't let the columns overlap each other when changing resolution?

Thank you very much in advance.

Regards,
Alex

AlexanderLamas

...My point is just keep the left and middle column nicely together, and always with the same gaps in between, even if I change the resolution of my screen.