Formatting the space between widgits

[GregSalvador]

Hi all,

I am putting several widgets in my mapView. Everything works fine, but I have noticed there is a gap in-between the widgets that I didn't define. Is there a way to change how big the space is? Here is the code I am using, nothing fancy:

//LayerListWidget initialization
var layerList = new LayerList({
view: view,
});
view.ui.add(layerList, "top-right");

//initialization of the basemapGallery widget
var basemapGallery = new BasemapGallery({
view: view,
});
view.ui.add(basemapGallery, {
position: "top-right"
});

//initializing the Scale Bar widget
var scaleBar = new ScaleBar({
view: view,
unit: "non-metric"
});
view.ui.add(scaleBar, {
position: "top-right"
});

[ThomasSolow · Accepted solution]

In the top-right ui holder, the space between widgets is decided by margin-bottom, so you could add a new CSS rule like:

.esri-ui-top-right .esri-component{
  margin-bottom: 0;
 }‍‍‍‍‍‍

sample: JS Bin - Collaborative JavaScript Debugging 

(default is 10x, 0 results in some overlap)

[GregSalvador]

Thanks a bunch Thomas, i uhhhh never thought to check the css style haha.