How to make a actionButton lies in the center

[Sijie Chen]

I am building an application with an input box and submitting buttons 

fluidRow(

          box(title = "Fold Change Analysis",solidHeader = T,status = "primary",width=8,

            textInput("FCThreshold", label = h3("Fold Change Threshold:")),

            actionButton("FCSubmit", label="Submit"),

            actionButton("FCReset", label="Reset")  

          )

          

        )

But the two buttons lies in the left of the box. How can I put them in the middle of the box? I heard that css may be suitable for solving this problem, but I am not familiar with css. I appreciate it if you can give me a solution in detail.

[Sijie Chen]

And I have another problem that the textInput box always have the same width as the outside box's, Is there any ways to make the textInput box shorter? It is so ugly....

I have tried to add a "width" parameter to textInput(  ...), but it seems that it will only ruin the format.

[Abhik Seal]

Hi

You can use something like

div(style="display:inline-block",submitButton("Analysis"), style=""display:center-align")

or can use separate fluid row




fluidRow(
      column(6, align="center", offset = 3,
         actionButton("button",label = "search),
         tags$style(type='text/css', "#button { vertical-align- middle; height- 50px; width- 100%; font-size- 30px;}")
      )