Control of logo position in Simpli

zovi

Hi again,
By default logo is pushed to the left margin of the page column. Is it possible to bring the logo to the edge of all page container (as I indicated in printscreen) and to maintain control over the logo, i.e. to continue to be managed by the Theme Customizer. In which file should I make changes?

Regards
Zovi

aman204

zovi Hi

By default, The logo is positioned in the Header Left module position when being added through theme customizer which is wrapped within template container to avoid rendering issues across various browser and screen sizes

You can add this to css file and adjust margin value accordingly which you wish to position the logo outside template container -

.navbar-brand{margin-left: -12em;}

zovi

Thanks Aman204,

The given solution really helps, but displaying logo now is not responsive. In general, on tablets is disappears from the screen, and returns on smartphone. Is it possible to use a more flexible code?

Regards
Zovi

saguaros

Hi Zovi,

You can use Media Queries to add specific style for associated screensize, for example in this case, you can use:

@media only screen and (min-width: 992px) {
.navbar-brand { margin-left: -12em; }
}

This css rule will be applied to screen larger than 992px only.