This topic is locked
[SOLVED]

 Custom CSS - Vertical Alignment in Table Header

4/2/2019 6:32:30 PM
ASPRunner.NET General questions
M
Mack88 authorDevClub member

I have a number of tables, some columns of which are sortable. The sortable column headings have a different vertical alignment that the rest and I can't get that to change with custom CSS. I've tried the below code without success

/* Put your custom CSS code here */
:host {

vertical-align: bottom !important;

color: red;

}


Any suggestions will be really helpful. I'm using ASPR.NET Enterprise 10.1 Build 32686.
Thanks
Chris

admin 4/3/2019

Can you show us a screenshot of what you trying to fix?

M
Mack88 authorDevClub member 4/3/2019



Can you show us a screenshot of what you trying to fix?


My apologies. I should have sent one in the first post.
Here's the screenshot. As you can see, not all labels are aligned vertically.
Misaligned Table Headings
Thanks in advance for your help.

admin 4/8/2019

Just wanted to say there is still no screenshot.

M
Mack88 authorDevClub member 4/8/2019



Just wanted to say there is still no screenshot.


Sorry for the delay ... the link to the screenshot is attached below.
Misaligned column labels
Thanks for your help ... and patience <img src='https://asprunner.com/forums/file.php?topicimage=1&fieldname=reply&id=87521&image=1&table=forumreplies' class='bbc_emoticon' alt=':)' />

admin 4/9/2019

Thank you, I see what you mean.
I see that this specific label was modified, it is not a hyperlink and it is red. What kind of changes were applied to that cell header? I need to be able to reproduce it in my test project.

M
Mack88 authorDevClub member 4/9/2019



Thank you, I see what you mean.
I see that this specific label was modified, it is not a hyperlink and it is red. What kind of changes were applied to that cell header? I need to be able to reproduce it in my test project.


The last column is not sortable (so no hyperlink). The custom CSS applied, via the CustomCSS button in Page Designer, is:

/* Put your custom CSS code here */
:host {

vertical-align: bottom !important;

color: red;

}


Thanks Sergey.

admin 4/10/2019

Got it. Applying the following CSS to the field label itself will help:

margin-bottom: 0px !important;
M
Mack88 authorDevClub member 4/10/2019



Got it. Applying the following CSS to the field label itself will help:

margin-bottom: 0px !important;



Perfect!! Thanks Sergey.