R Shiny - Column in Conditional Panel outside Sidebar Panel

Question

I am editing an existing R Shiny app: link . In ui.R , after line 48, I wanted to add additional information in the conditionalPanel . I have updated the code to look like this:

 conditionalPanel('input.showDendo==1', hr(), h4('Dendrogram Manipulation'), selectInput('dendrogram','Dendrogram Type',choices = c("both", "row", "column", "none"),selected = 'both'), selectizeInput("seriation", "Seriation", c(OLO="OLO",GW="GW",Mean="mean",None="none"),selected = 'OLO'), sliderInput('branches_lwd','Dendrogram Branch Width',value = 0.6,min=0,max=5,step = 0.1) ), hr(), h4("Row Dendrogram"), column( width = 6, selectizeInput("distFun_col", "Distance Method", c(Euclidean = "euclidean", Maximum = "maximum", Manhattan = "manhattan", Canberra = "canberra", Binary = "binary", Minkowski = "minkowski"), selected = "euclidean"))

and I am unable to figure out why the drop down is "outside" the grey background of the sideBarPanel as seen in the image:

Answer 1

Due to the styles of this app, you need to set column width to 12 or add another col-sm-6 element, then add <br> and <hr> :

hr(),
h4("Row Dendrogram"),
column(
  width = 12,
  selectizeInput("distFun_col",
                 "Distance Method",
                 c(Euclidean = "euclidean",
                   Maximum = "maximum",
                   Manhattan = "manhattan",
                   Canberra = "canberra",
                   Binary = "binary",
                   Minkowski = "minkowski"),
                 selected = "euclidean")),
br(),
hr(),

Then, it should look like this:

This happens, because the col-sm-* classes have float: left; attribute, which makes them heightless, so they overflow the parent container.