Increase Logo size

I’m with you trendyrevels! I’d like to have my logo centered and above the navigation, like it does when the window is resized horizontally to a narrow enough width that the nav bar collapses into the drop down button.

Anyone know how to override these settings in a child stylesheet?

Website here: mindovermattersound.com

Hi,
I also would like to change the size of the logo.

I’ve downloaded your logos and investigated as follows:

@trendyrevels, your .jpg is exactly 250px x 100px. Customizr has a tickbox to limit size to that dimension, so if you untick the box it still displays at that size. What size do you want? Can you produce a larger .jpg using a picture editor (eg Photoshop)?

@mindovermattersound, your .png is 899px x 125px. What size do you want?

The actual code generated is allowing about c25% for the brand/logo & c75% for the navbar. (It’s actually 23.0769% as set by Twitter Bootstrap grids).

If you try the following:

.navbar-wrapper .brand {width:23%; float:left;}
.navbar-wrapper .navbar {width:77%; float:right}

By increasing the .brand width>23% forces a bigger logo (depending on width of jpg/png, but results in an extra line for the .navbar. By playing with these 2 widths, I can work different layouts.

Making both width:100% moves the logo to it’s own line and centers it, with a full-width navbar beneath.

You may need to adjust margin/padding.

Hope this works for you.

Just was I was looking for.

summary:

CSS custom for changing the logo and navbar:

/* logo (change width from 0-100%; float from left/center/right) */
.navbar-wrapper .brand {width:100%; float:center;}

/*menu bar size*/
.navbar-wrapper .navbar {width:99%; float:center}

/*menu bar text */
.navbar .nav {
display: block;
float: right;
left: 0;
margin: 0 10px 0 0;
position: relative;
}

Thanks a lot!!!

ah this is perfect! the answer I was looking for. anyone know the css to move the social icons to the right (aligned right) to sit with the menu bar text?
thanks
https://powersuits.org/wordpress/

.social-block.span5{float:right}; will move the social icons as you’ve requested.

.social-block.span5{float:right;}

Sorry, semicolon was in wrong place.

thanks! is there anyway to get them to move over more… to be aligned with the side of the screen? right now they appear to be floating in the middle of the bar?

also do you know how to remove the border around the nav bar?

thanks again for your quick reply!
Aliya
https://powersuits.org/wordpress/

Where exactly can you enter this CSS code to change the logo and menu bar? I’m quite new to changing the CSS code so not sure exactly where to change this to run over all pages.

Thanks

In the “Custom CSS” part of the dashboard.

Hi there,

Does anyone know how to get the tagline to appear under the logo once it’s centered? Essentially I’d like the logo and nav bar to appear like they do on smaller screens, with the logo and tag line centered, and the menu items only visible in a drop down.

Thanks,
Jacqui

Hello everybody,

I’m also trying to increase my logo size a little bit to at least 350px wide.

I’ve try the solutions you propose here with no luck.

My website is:

https://dporfebre.com

Any help is greatly appreciated.

@npalamidis. It’s currently showing as 365w x 700h!

Start a new topic if you need more help please.

@rdellconsulting

Pasting your code:

.navbar-wrapper .brand {width:23%; float:left;}
.navbar-wrapper .navbar {width:77%; float:right}

into the custom CSS box and reversing the proportions
(brand width:77%, navbar width: 23%)
got poor results for me:
the logo image is still displayed first,
then the navbar beneath it.
Even if I set them so that their total is less than 100%, same results.

Ideally I would like to have them both at the top of the page, at the same level
with the navbar large enough only to show the button (and dropdown menu).

Suggestions?

florascension.com/wordpress/

Hi, I’m having problems as well. Changing the second percentage affects the tagline, but changing the first percentage does not affect the logo at all.

https://blogs.luc.edu/urbanature/