光沢のある液体の中に画像を水平にセンタリングする

Question

光沢のあるui fluidPage内で3つの画像を1列に配置し、各画像の幅を300pxに固定できますか？取得するには：私が持っていた

ひとつのアイデアは、splitLayoutを使用して、何とかウィンドウ幅の関数として画像を挿入することでしたが、私はこれをacheiveするかどうかはわかりません。 splitLayoutを使用してイメージをウィンドウの％として設定することができますが、具体的には中間イメージを300ピクセルにしたいと考えています。

fluidPage(fluidRow(
    splitLayout(cellWidths = c("34%", 300, "34%"), cellArgs = list(style = "padding: 0px"), style = "border: 0px; padding: 0px;", 
     div(img(src="image1", height=300, width=300, align="right"), 
     div(img(src="image2", height=300, width=300, align="center"), 
     div(img(src="image3", height=300, width=300, align="left")), ... 

だから問題は、私は画像が中心からずれている取得することです。

をしかし、33％が言うように、私は真ん中のセルを設定するときに、画像間のギャップが大きすぎます。

splitLayout(cellWidths = c("34%", "33%", "34%"), cellArgs = list(style = "padding: 0px"), style = "border: 0px; padding: 0px;", 
div(img(src="image1", height=300, width=300, align="right"), 
div(img(src="image2", height=300, width=300, align="center"), 
div(img(src="image3", height=300, width=300, align="left")) 

それでは、私は後の午前はcellWidths = c((windowWidth-300)/2, 300, (windowWidth-300)/2)ですが、私はwindowWidthを抽出する方法がわからないです。

Answer 1

私は列関数を使用して、それを修正するために管理し、私は単にスタイルの幅引数の除去とペアalign="center"引数が欠落していました。たとえば、

library(shiny) 

server = function(input, output, session) {} 

ui <- fluidPage(fluidRow(
     column(12, align="center", 
       div(style="display: inline-block;",img(src="image1", height=300, width=300)), 
       div(style="display: inline-block;",img(src="image2", height=300, width=300)), 
       div(style="display: inline-block;",img(src="image3", height=300, width=300)))) 
) 


shinyApp(ui = ui, server = server) 

Answer 2

これは何か？

rm(list = ls()) 
library(shiny) 

server = function(input, output, session) {} 

ui <- fluidPage(fluidRow(
    #Change column(x, for desired width 
    column(6, 
     div(style="display: inline-block; width: 33%;",img(src="https://cran.r-project.org/Rlogo.svg", height=300, width=300)), 
     div(style="display: inline-block; width: 33%;",img(src="https://cran.r-project.org/Rlogo.svg", height=300, width=300)), 
     div(style="display: inline-block; width: 33%;",img(src="https://cran.r-project.org/Rlogo.svg", height=300, width=300)))) 
) 


shinyApp(ui = ui, server = server)