cyresimard

IT WORKED!!!! m.hallor, you rock. Thank you so much.

As I continue down this road I will definitely keep those tips in mind. They were very clear and educational and for that I am grateful.

She wasn’t sold on having the about menu up there and we’re going to make each subcategory a link at the bottom of the page. I haven’t actually made the change but I’m pretty sure I’ve become familiar enough with my tools in the past week to know how to do it. So yeah, she likes your idea lol.

Again, I really appreciate your help. Thanks.

-Cyre

Wait! It did do something, just not right away! Is there a delay when you edit a .css instead of using the WP interface?

I did successfully get every category in a single row, but in the process I tripled (estimated) the search bar instead of making it go away. The other menu (my account, logout) moved instead of disappearing, same with the cart button, and the header got taller, causing the picture to be repeated a little at the top and bottom.

I’m really excited about the progress, if one of you could give me the last piece of the puzzle I would be thrilled.

-Cyre

Thanks guys. I do have jetpack installed (I found out about that while trying to solve the problem without bothering you). I am not sure how to use a freshly coded .css file to alter a website. Like, how do I implement it? The website is adriennesboutique.com

m.hallor, I tried looking though the .css files again this afternoon with fresh eyes and did find something that I thought would fix my problem and was a bit disappointed when I couldn’t see any change whatsoever. There are two (stylesheet and style-rts.css) and I wasn’t sure which of the two were the one I had to edit so I modified both of them. They seem to be copies of each other, or at least extremely close. Not sure what the deal is there. Anyways what I did (er, attempted) was eliminating the search bar up top, the cart up top, and the small menu up top (hard to see because I haven’t yet gotten to the point of worrying about fixing font colors), so I could expand the right hand side of the menu until it doesn’t need a second line to fit it all. I tried to do this by commenting out ( started by /* and finished by */ if I understand correctly) what I believe are their respective iterations and changing the width of .woocomerce-active .site-header .main-navigation to 100%. I’m also going to dismantle the About drop down menu and make each sub category a link at the bottom of the page so I shouldn’t need to make the right border much further than it already is.

I pulled this from the Stylesheet (style.css)

/**
* General Layout
*/
@media screen and (min-width: 768px) {
.site-header .site-branding,
.site-header .site-logo-anchor,
.site-header .site-logo-link {
display: block;
width: 21.7391304348%;
float: left;
margin-right: 4.347826087%;
clear: both; }
.site-header .site-branding img,
.site-header .site-logo-anchor img,
.site-header .site-logo-link img {
height: auto;
max-width: 100%;
max-height: none; }

.woocommerce-active .site-header .secondary-navigation {
width: 47.8260869565%;
float: left;
margin-right: 4.347826087%; }
.woocommerce-active .site-header .site-search {
width: 21.7391304348%;
float: right;
margin-right: 0;
clear: none; }
.woocommerce-active .site-header .main-navigation {
width: 73.9130434783%;
float: left;
margin-right: 4.347826087%;
clear: both; }
.woocommerce-active .site-header .site-header-cart {
width: 21.7391304348%;
float: right;
margin-right: 0;
margin-bottom: 0;
padding-top: 1.618em; }
.site-branding .site-description {
margin-bottom: 0;
display: block; }
.site-branding,
.site-search,
.site-header-cart,
.site-logo-anchor {
margin-bottom: 1em; }
.site-header .subscribe-and-connect-connect {
float: right;
margin-bottom: 1em; }
.site-header .subscribe-and-connect-connect .icons {
list-style: none;
margin: 0; }
.site-header .subscribe-and-connect-connect .icons a {
font-size: 1em !important; }
.site-header .subscribe-and-connect-connect .icons li {
margin: 0 0 0 0.53em !important;
display: inline-block; }
.col-full {
max-width: 65.141em;
margin-left: auto;
margin-right: auto; }
.col-full::after {
clear: both;
content: “”;
display: table; }
.col-full:after {
content: ” “;
display: block;
clear: both; }
.site-content::after {
clear: both;
content: “”;
display: table; }
.content-area {
width: 73.9130434783%;
float: left;
margin-right: 4.347826087%; }
.widget-area {
width: 21.7391304348%;
float: right;
margin-right: 0; }
.right-sidebar .content-area {
width: 73.9130434783%;
float: left;
margin-right: 4.347826087%; }
.right-sidebar .widget-area {
width: 21.7391304348%;
float: right;
margin-right: 0; }
.left-sidebar .content-area {
width: 73.9130434783%;
float: right;
margin-right: 0; }
.left-sidebar .widget-area {
width: 21.7391304348%;
float: left;
margin-right: 4.347826087%; }
.storefront-full-width-content .content-area {
width: 100%;
float: left;
margin-left: 0;
margin-right: 0; }
.content-area,
.widget-area {
margin-bottom: 2.618em; }

Am I reading it wrong?