border for Grid Layout

[Former Member]

Hi Developers,

Does anyone know how to put border around each cell so that a gridlayout can look like a table?  I used CSS to add border on the sides but what i exactly want to do is create a border around each cell so that when I run the report, I see a table instead of one big red box.

Thank you for all your help and suggestion!!

Raj

[mike_howles4]

Try this rule example:

  .sapUiMlt.zenControl {
    border: 2px red solid;
  }
  .sapUiMlt.zenControl td:first-child {
    border-left: 2px red solid;
  }
  .sapUiMlt.zenControl td:last-child {
    border-right: 2px red solid;
  }
  .sapUiMlt.zenControl tr:first-child td {
    border-top: 2px red solid;
  }
  .sapUiMlt.zenControl tr:last-child td {
    border-bottom: 2px red solid;
  }
  .sapUiMlt.zenControl td {
    border: 2px black solid;
  }

Worked for me.  You may opt to give that particular Grid its own CSS Class name so that those rules don't apply to all your grids, but this was a simple example that will work on all grids.

[Former Member]

yes, like Mike already said.

Additionally I would put these into a class

myClass.sapUiMlt.zenControl {  border: 2px red solid;  } 

and assign this class to each grid component you want to have the inside borders. otherwise automatically

all your grid cells will show borders.

Jeroen

[Former Member]

Hi Mike,

Where am I suppose to put this code?  Are you creating this as CSS and uploading it or you are going to the root folders and changing the defaults there? 

[mike_howles4]

This has been answered many times.  Search.