Question

I’m trying to create a simple centered title with Boostrap widgets. I tried that :

WB.Layout.fixed(
    (WB.Grid.row([{span:16, offset:none, content:<div>title</>}]))
)

… but the text just appear at the left of the row. I tried to add “text-align:center” to the div tag, but it caused a xml error when I tried to display the result in a browser. How can I indicate that I want “title” to be displayed at the center of the block ?

Thanks in advance.

Answer 1

Which version of bootstrap are you using?

Here is a sample code :

import stdlib.themes.bootstrap
import stdlib.widgets.bootstrap

WB = WBootstrap

function start() {
  WB.Layout.fixed(
    (WB.Grid.row([{span:12, offset:none, content:<center>title</center>}]))
  )
}

Server.start(
   Server.http,
   { page: start
   , title: "Hello, world"
   }
)

I used span:12 because the current version of bootstrap is 12 columns max.