-
brianthom
Hi,
Is it possible to change the position of the logo image in the header. By default it aligns left of the main title, how do I for example align it to the right of the title or above the title or below it? Or even move it to the far left or the far right of the header on desktop?
Kind Regards,
Brian Thompson
-
Hi there,
it will require a little CSS.
Can i see the site ? And ill provide the various options -
brianthom
Hi David,
Sorry I took so long to get back to you, The site has only just gone live today.
Also, I’m wondering how do I change the size of the site title in css
Kind Regards,
Brian Thompson
-
Here are the CSS options:
a. Logo to the right of the site title:
/* logo to the right */ .site-branding-container { flex-direction: row-reverse; } .site-branding-container .site-logo { margin-left: 1em; }
b. Logo left-aligned above the site title
/* logo to the top left */ header .site-branding-container { flex-direction: column; align-items: flex-start; } .site-branding-container .site-logo { margin-bottom: 1em; }
c. centered header with logo above
/* centered header logo above */ header .inside-header { justify-content: center; } header .site-branding-container { flex-direction: column; } header .site-branding-container .site-logo { margin-bottom: 1em; margin-right: 0; }
d. centered header with logo below
/* centered header logo below */ header .inside-header { justify-content: center; } header .site-branding-container { flex-direction: column-reverse; } header .site-branding-container .site-logo { margin-top: 1em; margin-right: 0; }
If theres one specifically that you need and want to adjust it for the mobile layout then let me know.
-
brianthom
Hi David, Sorry for the delay. Thank you so much for providing me with all of the above. I’ve just used C. with for mobile, enclosing it in @media screen.
Kind Regards,
Brian Thompson
-
Glad to be of help!
- You must be logged in to reply to this topic.