I was mucking around in the layout.css to adjust the horizontal placement of my header (just moving it from left-aligned to centered by changing the 3 em in the body.media-desktop div.header div logo to 15em), when lo and behold my filter checkboxes were altered as shown below, before and after. I never changed anything close to the Filter.
BEFORE: Normal checkboxes
AFTER: ABNORMAL (multiple format changes to the checklist)
Note that in the "after" shot, I can actually click on the "remains" of the checkbox to filter.
13
Replies
Hi there
Until Willam van Weelden pops in to advise I will say that with my own experimenting on the layout file to try and better control what is impossible to control via the customization dialog, I encountered some odd behaviors myself. Somehow I munged my whole layout. I'm not sure you have said anything about doing this, but you might try creating a completely new Single Source Layout in the pod and seeing if that clears things. That seemed to be the answer for my own case.
Cheers... Rick 
Exactly! Here's what I subsequently encountered:
This problem had a ripple effect on other elements in my output. Multiple elements seem to have shifted; specifically:
1. My top TOC book is hidden, and once a TOC book is open, I can't close it (I rebuilt TOC just to be sure).
2. If I select a different topic than the default topic, I can then show that default topic by clicking up inside the header (not shown above but clicking above the TOC icon re-opens the default topic).
3. The extra search box at right has shifted downwards from its original position. This is the one whose background color I had so successfully changed all by myself - only to have this come back to haunt me:
If a miracle cure exists in a piece of code, it would be wonderful to know of it. Once taken that miracle, I will never, ever go into this code again!
Very helpful, and thank you so much for responding to this.
I kind of concluded along the way that element positions are interrelated. I'm no coding expert, but that theory made sense. Yes, I had opened and edited the CSS in the RH editor, so I've now learned from experience that it is not to be reckoned with.
I have no experience using a SCSS file. It's funny - I'd read about that file in some related posts, but could never find it in my project folder. Is it usually found there or else in the RH 2015 installation folder - or is it standard practice to simply access it via your link ? I downloaded the file, but now, I'm wondering what tool can edit it easily. Do you know of one you would recommend? I downloaded Koala, but see that it's for converting the newly improved scss file into a css for import back into my project when I'm ready. Unfortunately, Scss opens in Notepad like this - not good: 
Thanks loads!
Yep, that's what it looks like in my own Notepad as well.
My own best guess is that people like Willam have some very special glasses they wear that magickally unscrambles all the spaghetti into nice and perfectly understandable code segments.
It's the only thing that makes sense. 
Cheers... Rick
Hi Willam
I'm curious about your admonishment of avoiding Notepad and opting instead for Notepad ++. Moments ago I downloaded Notepad ++ and opened one of these files just to see.
Here is a comparison of the same file open in Notepad as well as Notepad ++:
The only appreciable difference I see is the color highlighting. Is that the purpose of the suggestion? So instead of finding an ocean of text, it's easier to make out possibly what you are wanting by observing the color codes?
Cheers... Rick
Voila! Below is the Charcoal Grey .scss in Notepad++. I tested this tool by opening the Adobe download Charcoal Grey .scss, converting it to .css in Koala, and then using it in a dummy project to generate a successful output, which looked fine. Ultimately, I wasn't entirely comfortable taking time to work in the .scss file for my current project needs, only because I don't know how to code in it. When I have some free time I can play with its settings, and my bet is it works well.
My final solution was to just duplicate my self-corrupted project; paste the default Charcoal Grey layout.css into its Layout folder; and then just quickly rebuild my custom settings using the Layout Customization tool, which was a life-saver since I could just visually scan the colors of each component in my former project and easily enter them. BTW, I also discovered that, if you ever muck up the layout like I did with too much direct editing of the layout.css, when you go to rebuild your duplicated project, use the Reset Component button to "clear" the settings; otherwise, I found that just re-entering them did not "take." Even with the default layout.css in use. Many thanks to Rick and Willam. It's really been a super lesson!!
AdChoices