Announcement

Collapse
No announcement yet.

[SOLVED] Align edit row "pencil" icon.

Collapse
This topic is closed.
X
X
  • Filter
  • Time
  • Show
Clear All
new posts

  • [SOLVED] Align edit row "pencil" icon.

    Hi

    Does anyone know how to re-align the pencil (and other) grid editing icons?

    I have rows with multiline data (so can be quite "thick") - to make things look balanced I have the data aligned vertically, but the icons in question are at the top each row, and I cannot see a way to make them central (vertically) too? Attached pic illustrates what I mean (note the rows could end up much thicker than shown)

    Capture1.JPG

    Any ideas?

    Thanks

  • #2
    Search to align vertically in CSS
    /Giuseppe

    Professional Scriptcase Services
    Some Customers opinions

    Comment


    • #3
      Thanks Giu - will try that

      Comment


      • #4
        Giu

        Had a look around but couldn't see anything that would help. Also looked in the CSS Button options (under Layout Menu) too and can see the "Pencil" icons, but very limited what I can do to them - basically can just change the image?

        Any samples anywhere?

        Thanks

        Comment


        • #5
          informative post, i will try to use
          You can easily check out our best quality pass4sure exam dumps prepare you well for the real Johnson University Florida exam. You can also get success in real exam of ISM with the quality.

          Comment


          • #6
            Use Web Console to see what CSS use the pencil or the cell, and on your onSCriptIni do an echo with a CSS modifiying the rule to align vertiucally. Sorry, but right now I don't have any project with this problem to take a look.
            /Giuseppe

            Professional Scriptcase Services
            Some Customers opinions

            Comment


            • #7
              Thanks Giu - that does make more sense. I'll experiment and update later when I get a chance.

              Comment


              • #8
                Ok - I have added this code on the onScriptInit:

                Code:
                echo '<style type="text/css">';
                echo '.scGridFieldEvenFont { valign: middle; }';
                echo '.scGridFieldOddFont { valign: center; }';
                echo '</style>';
                Looks like there are settings for alternate rows - so added for both (not sure if it should be "middle" or "center", so used both as a test).

                Neither work - but suspect it's my poort HTML / CSS knowledge more at fault.

                After inspecting the element in question (e.g. pencil icon) I get (see pic):

                Capture.jpg

                I have higlighted in yellow what I think the relevant bits are. Certainly, scGridFieldEvenFont and .scGridFieldOddFont don't seem to offer vertical alignment attributes. This is how the form looks - you'll see the rest of the row is vertically aligned in the center:

                Capture2.JPG

                I'm clearly getting my attributes / styles muddles up :-(

                Any thoughts please?

                Comment


                • #9
                  Try adding !important

                  http://webdesign.about.com/od/css/f/blcssfaqimportn.htm
                  /Giuseppe

                  Professional Scriptcase Services
                  Some Customers opinions

                  Comment


                  • #10
                    Thanks Giu

                    Tried the following first (in onScriptInit in the grid) and it worked! I didn't need the !important in the end (but a good shout), it was simply a matter of picking the right attribute at the right time.

                    Code:
                    // makes "pencil" etc align vertically in the middle
                    
                    echo '<style type="text/css">';
                    echo '.scGridFieldEvenFont { vertical-align: middle; }';
                    echo '.scGridFieldOddFont  { vertical-align: middle; }';
                    echo '</style>';
                    Capture3.JPG

                    Thanks for your help!

                    Comment


                    • #11
                      Glad to hear it's solved
                      /Giuseppe

                      Professional Scriptcase Services
                      Some Customers opinions

                      Comment

                      Working...
                      X