On many of the Backdrop block configurations, it is possible to use a tool to choose "STYLE SETTINGS", and then you can work with dynamic or default DIV/ASIDE/SECTION, and input wrapper, heading, and content classes. Can anyone recommend a resource where I can learn more about how to use these? So far, I have not found anything in the Backdrop documentation, although I see excellent explorations of other topics...
Accepted answer
Comments
Backdrop puts an individual and different class on each block. So if you want to manage through CSS several different blocks in a uniform way, you must write complicated CSS rules containing individual classes of each of these blocks. This option allows you to set the same class of blocks with the same design and manage them through a single rule.
By selecting DIV/ASIDE/SECTION and other HTML tags you can manage more correctly the semantic structure of the site.
The choice of title level also helps for the semantic structure to build properly headings map for your site:
https://addons.mozilla.org/en-US/firefox/addon/headingsmap/
https://chrome.google.com/webstore/detail/headingsmap/flbjommegcjonpdmen...
Thanks, amilenkov, for your response! I very much appreciate it. Your observation that "Backdrop puts an individual and different class on each block" matches my understanding of the process. Unfortunately, my progress is limited by my lack of experience with CSS, and how it interfaces with backdrop. Basically, I am trying to create a footer that does not float above the content, but stays at the bottom. I have followed the usual recommended CSS guidelines (bottom:0;) in my style sheet, but it still floats. I set it up in Backdrop as the class "footer" (tried both at the FOOTER layout level and the hero-block level. I am able to do colors, text and full-screen width, but it won't stay at the bottom. I suspect that the html may be calling the footer at a lower level than the top, and so it won't stick. The Firefox web developer tools (Inspector) have been helpful for me - but it looks like I have more to explore.
In any case, thanks again for your thoughtful comment. I will continue my pursuit of the solution to the problem...
Robert
Try with CSS rule:
.footer {
clear: both;
}
This seemed to help - along with removing some borders I put in at the body level. Interestingly, Chrome behaved differently with my footer than did Firefox. I think each of them needed a separate solution. Also, I changed my base theme from Colorbox to Basis. Although Colorbox is derived from Basis, I think it "tweaks" some of the HTML.
All in all, I am making slow but sure progress. Thanks for your tips!!
Try with CSS rule:
.footer {
clear: both;
}