Question Re: border for Grid Layout in Technology Q&A

border for Grid Layout

Former Member — Thu, 23 Apr 2015 19:39:00 GMT

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

Re: border for Grid Layout

mike_howles4 — Thu, 23 Apr 2015 21:48:28 GMT

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.

Re: border for Grid Layout

Former Member — Fri, 24 Apr 2015 04:34:41 GMT

I hope this would help you http://scn.sap.com/thread/3724149

Thanks,

Nithyanandam

Re: border for Grid Layout

Former Member — Fri, 24 Apr 2015 07:11:14 GMT

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

Re: border for Grid Layout

Former Member — Fri, 24 Apr 2015 15:37:02 GMT

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?

Re: border for Grid Layout

mike_howles4 — Fri, 24 Apr 2015 16:34:50 GMT

This has been answered many times. Search.

Re: border for Grid Layout

Former Member — Mon, 27 Apr 2015 17:06:47 GMT

Hi Nithyanandam,

Thank you for your input as it worked perfectly for what I needed!

Hi Michael,

I did implemented what you suggested but it did not work for me. I am DS 1.3 SP1. I made your code as part of the CSS which I was expecting to override the existing parameters but for some reason it did not do it for me. Thank you for your help anyways!

Raj

Re: border for Grid Layout

Former Member — Tue, 28 Apr 2015 04:59:38 GMT

Hi Raj, Glad it helped. You are welcome. Thanks, Nithyanandam

Re: border for Grid Layout

Former Member — Tue, 28 Apr 2015 20:13:15 GMT

Hi Venu,

I understand that you are change the default parameters by using CSS. The question that I would like to find out is where can i find these default settings for different components?

Re: border for Grid Layout

Former Member — Tue, 28 Apr 2015 20:43:48 GMT

Nevermind, I found out...i guess. I executed the dashboard and pressed F12 to access the developer page where most of the things are listed.

Raj