Logo position in Boundless Theme

Highlighted
New Member
3 0 0

hi guys,

I have set a custom logo in my slideshow and now want to get a better position. Should I make changes inside header.liquid or theme.liquid?

https://scr.hu/MMNaaq

Thanks for your support.

0 Likes
Highlighted
Shopify Staff
Shopify Staff
15 0 3

The logo in Boundless is displayed in a table-cell so you can use the css property vertical-align to align the positioning. You can read more about vertical alignment here: https://css-tricks.com/almanac/properties/v/vertical-align/ 

The logo is styled to align to the middle so you can use the values 'top', 'bottom' or 'middle' for positioning. Just add the following to the bottom of your theme.scss.liquid file and replace 'top' with 'bottom' if you want the logo to appear at the bottom of the slideshow.

.hero__logo-centered {
  vertical-align: top;
}

 

0 Likes
Highlighted
New Member
3 0 0

Thanks a lot David. That worked out well but i want my logo even lower, how can I use vertica-align to set this for example 10px from bottom?

0 Likes
Highlighted
New Member
3 0 0

Okay, I figured out that I can use -250px;

That site i pretty usefull https://www.w3schools.com/cssref/playit.asp?filename=playcss_vertical-align&preval=25px

0 Likes
Highlighted
Shopify Staff
Shopify Staff
15 0 3

You shouldn't need to use a value as big as -250px - make sure that your logo doesn't have excess whitespace around it and you should be fine with just bottom or 10px.

0 Likes
New Member
1 0 0

Hi, im trying to do this too but for some reason its not working for me. What do you mean put it at the bottom of the file because im just copying and pasting the code you but at the bottom.

0 Likes
Highlighted

@Ryan100,

Whats is your issue?

Want to modify or incorporate custom changes on store, Hire us.
If helpful then please Like and Accept Solution .
Email: pallavi@oscprofessionals.com
Skype : oscprofessionals-87
Free Review and advice for sale on store | Shopify Private App | Custom Theme Development | Custom Modifications In To Shopify Theme | SEO & Digital Marketing | Site Speed Optimization | Performance Site Audit
0 Likes