Items are not aligned properly in the application

[4.1.2]

Items are aligned to the top in bss application instead of vertical middle. Exported files behave as intended with proper alignment.

HTML

<header class="masthead">
    <div class="intro-body">
        <div class="container">

CSS

.masthead .intro-body {
  display:table-cell;
  vertical-align:middle;
}

Your intro-body class will need to have a explicit height for the container to align to the middle of it. Or your not providing enough info and/or example to understand what it is your trying to accomplish.

Saj

I just want to have a text put exactly in the middle of browser window, regardless of the actual window size in px. It should adjust automatically. In my project this alignment works OK, when I observe the results in Firefox browser. In BSS application GUI, item sticks to the top.

I already sent my project file by email.

Set the first div to use Flex in the Options pane so it looks like:

<div class="d-flex masthead">
    <div class="intro-body">
        <div class="container">
            <p>Paragraph</p>
        </div>
    </div>
</div>

Then you can use this CSS.

.masthead {
  width:100%;
  height:100vh;
}

.intro-body {
  margin:auto;
}

Saj