Side-by-side

Home Forums Classic DFFS Side-by-side

Viewing 6 reply threads
  • Author
    Posts
    • #10301
      Ally
      Participant

        Hello Alexander,

        I used the rules you provided in DFFS Styling, I was able to set most of the fields in a straight line (please see example attached), there are two fields that I couldn’t get it to line-up as the others. Could you please tell me what’s I’m missing here.

        .sbs_FieldTable .dffs_tdWrap *{
        width:auto !important;
        }
        .sbs_tdIndex_1, .sbs_tdIndex_2, .sbs_tdIndex_3, {
        min-width:450px !important;
        width:450px !important;
        }
        }
        .sbs_tdIndex_4, .sbs_tdIndex_5, .sbs_tdIndex_6, {
        min-width:450px !important;
        width:450px !important;
        }
        }
        .sbs_tdIndex_7, .sbs_tdIndex_8, .sbs_tdIndex_9, {
        min-width:450px !important;
        width:450px !important;
        }

        }
        .sbs_tdIndex_10, .sbs_tdIndex_11, .sbs_tdIndex_12, {
        min-width:450px !important;
        width:450px !important;
        }
        }
        .sbs_tdIndex_13, .sbs_tdIndex_14, .sbs_tdIndex_15, {
        min-width:550px !important;
        width:450px!important;
        }

        }
        .sbs_tdIndex_16, .sbs_tdIndex_17, .sbs_tdIndex_18, {
        min-width:auto !important;
        width:auto!important;

        Much appreciated

        Attachments:
      • #10354
        Alexander Bautz
        Keymaster

          Hi,
          First you have to many end curly braces “}” – try removing these as a start.

          If this does not help, your problem is most likely that you have options in the dropdown that pushes the width. You can address it like this (assuming it is in index 13):

          .sbs_tdIndex_13 select{
            max-width:200px; /* Change 200 to any number that fits your form widht */
          }

          Hope this helps,
          Alexander

        • #10417
          Ally
          Participant

            Thanks so much Alexander,

            Somehow it doesn’t work for me. It could be me because I have very little experience with CSS. Do you by chance have any samples for beginner?

            I appreciate the helps!

          • #10427
            Ally
            Participant

              I finally got it to work not. Thanks so much Alexander :)!

            • #10432
              Alexander Bautz
              Keymaster

                I’m glad you figured it out.

                Alexander

              • #10437
                Ally
                Participant

                  Hello Alexander,

                  Is there a way to set fields in DispForm (image #2) to look exactly like the EditForm (image #1)?

                  Thanks

                • #10445
                  Alexander Bautz
                  Keymaster

                    Hi,
                    I’m aware that the styling of the forms is a bit cumbersome, and I’ll see what I can do about in a future version.

                    Depending on how you have set it up in NewForm, you should be able to use more or less the same CSS. This example CSS is used in both NewForm, DispForm and EditForm on a form with three columns of SBS-columns:

                    /* First set all width to auto */
                    .sbs_FieldTable .dffs_tdWrap *{
                    	width:auto !important;
                    }
                    /* Set column 1, 2 and 3 to a width of 200px */
                    .sbs_tdIndex_1, .sbs_tdIndex_2, .sbs_tdIndex_3{
                    	min-width:200px !important;	
                    	width:200px !important;
                    }

                    Alexander

                    • This reply was modified 8 years, 7 months ago by Alexander Bautz. Reason: Fixed comments in CSS
                Viewing 6 reply threads
                • You must be logged in to reply to this topic.