› Forums › Classic DFFS › Column Alignment
- This topic has 5 replies, 2 voices, and was last updated 5 years, 12 months ago by Alexander Bautz.
-
AuthorPosts
-
-
April 30, 2018 at 07:14 #20713Kelly TurdanesParticipant
Hi Alexander,
I’ve been trying to make the column alignment work but to no avail.
I’ve added the css script from here https://spjsblog.com/dffs/dffs-styling/ but my form doesn’t look how I expect it to be.I’ve attached a screenshot of how it currently look. I was expecting it to be more aligned but the fields doesn’t seem to be adjusting as how it should be. Could you let me know what might be the reason please.
Thank you.
Kelly
Attachments:
-
April 30, 2018 at 21:08 #20740Alexander BautzKeymaster
Hi,
This article is a bit outdated because I have removed the “dffs_tdWrap” class (as noted in the top of the article) – can you show me the CSS you use now?Alexander
-
May 1, 2018 at 07:06 #20756Kelly TurdanesParticipant
Hi Alex,
Thanks. Yes I removed this css entry now and added the one particularly for TdIndex. My css entry below.
.ms-formlabel {
font-weight: bold;
}
.ms-formlabel h3.ms-standardheader {
font-weight: bold;
}.ms-standardheader {
font-weight: bold;
}td.ms-formlabel nobr {
white-space: normal;
font-weight: bold;
}.tabH1, .tabH2, .tabH3 {
background-color: #44788b;
color: white;
padding-left: 5px;
text-transform: none;
}.tablabel{
text-transform: none;
}.sbs_tdIndex_1, .sbs_tdIndex_2, .sbs_tdIndex_3, .sbs_tdIndex_4 {
min-width:200px;
width:200px;
}
.childTableCell {
vertical-align: top;
}thank you.
-
May 1, 2018 at 08:51 #20770Alexander BautzKeymaster
Did it make any difference to your forms layout?
Alexander
-
May 1, 2018 at 23:35 #20779Kelly TurdanesParticipant
No. There was no change in the layout.
Thanks.
Kelly
-
May 2, 2018 at 20:20 #20795Alexander BautzKeymaster
Hi,
I have updated the article here.Basically it was just a matter of removing the dffs_tdWrap from the selector like this:
.sbs_FieldTable *{ width:auto !important; } /* Ensure the tooltip icon won't collapse */ .customTooltipIcon{ width:18px!important; }
Hope this gets you back on track.
Best regards,
Alexander
-
-
AuthorPosts
- You must be logged in to reply to this topic.