You could do it with CSS without messing with the number of columns. Something like this:
.site-branding,
.main-navigation {
width: 50%;
}
And you’ll have to add some media queries to make it as you want on smaller screen too:
@media (min-width: 991px) {
.site-branding,
.main-navigation {
width: YOURWIDTHHERE;
}
}
Thanks again. The site branding code worked perfectly. You’re a great help.
However, I don’t quite understand the media queries…
Are these in the event that the site is viewed in full on a mobile device? I noticed that when I view the site in full on my mobile device, the blog title and the tagline below it are on a left column, with the pull-down menu bar in the center. What width shall I set there? When I enter 991px min, as you stated, I get an error on the custom CSS.
I did check online and found this:
// Small screens
@media only screen { } /* Define mobile styles */
@media only screen and (max-width: 40em) { } /* max-width 640px, mobile-only styles, use when QAing mobile issues */
I also found this site.
Please advise. Thanks Vladff.
The media queries will set different widths for those two elements for different screen widths. In my example I wanted to write @media (max-width: 991px)
instead of min
.
So until now you’ve set 50% for the branding and 50% for the menu.
You now need to make sure your changes will look good on smaller screens. For example you can add this:
@media (max-width: 991px) {
.site-branding {
width: 70%;
}
}
And continue in this manner for other screen widths if you feel it’s necessary. This should get you started but please note that this is more about using CSS than a theme related thing.
Excuse me Vlad,
I want to ask help to you,
here is my problem, i want to make my menu to be a single line, and move my site logo to left.
is that possible? i’ve try some other way from the thread, and it won’t work perfecly
here is my site : http://pijarsukma-furniture.com/
Thanks a lot
hi
I want to change my top header background color. i am unable to find the respective css file.
plz help me where i can get the css file so that i can change th css using child theme