where is style for hr ? Where should it be?

Permalink
Were is the css for <hr> if it is currently in a sheet? If I want to override it where should I put the new style

Biged2011
 
hutman replied on at Permalink Reply
hutman
This depends fully on what theme you are using, you should be able to override it by going into the Customize menu and adding some Custom CSS there.
Biged2011 replied on at Permalink Reply
Biged2011
this is the elementary theme supplied as standard generic install, Is there a common location in this theme? C5 8.3.2
hutman replied on at Permalink Reply
hutman
If you check out this documentation it will tell you where to go to customize the theme, at the bottom of the Customize panel there is a spot where you can put custom CSS

https://documentation.concrete5.org/editors/in-page-editing/the-tool...
Biged2011 replied on at Permalink Reply
Biged2011
There is a block in "Elemental" theme that is simply <hr> which my old eyes cannot easily see when rendered on the page. The question was really did this ever get styled and where is it? The answer seems to be 'There is no style on the tag'. I may search all the css and less to see but that seems useless. It has never been addressed. Unless others have done so I will modify the block and add style there. I may even add parms and customize each instance as I assume it was meant to be but maybe I am wrong. It will make me feel complete.

The block is currently only:

<?php defined('C5_EXECUTE') or die("Access Denied."); ?>
<hr/>

Maybe something like:

<?php defined('C5_EXECUTE') or die("Access Denied."); ?>
<hr style="height:8px;
width: 80%;
margin-left: auto;
margin-right: auto;
background-color:#FF0066;
color:#FF0066;
border: 0 none;
margin-top: 5px;
margin-bottom:5px;
"/>

Why put a block in a theme unless it is useful ???
Are there any other thoughts?
Gondwana replied on at Permalink Reply
Gondwana
I think that the default c5 hr is styled with too much vertical space. It takes most of the screen height on a small phone.

It can indeed be styled using the UI as described above. An alternative approach (if using Elemental) is to create a file such as
application\themes\elemental\css\biged.css

In that file, put your CSS (with non-greedy selectors). For example, mine includes:
div.ccm-page hr {margin-top:20px; margin-bottom:20px;}


If this doesn't appear to be working, clear various caches.
Biged2011 replied on at Permalink Reply
Biged2011
This does not seem to work. I must still be missing something that is needed if it worked for you. I added the color to get more visual confirmation and nothing. can you verify with more than margins?