Wordpress Themes - WP Forum at BFA
Click here to register or to donate.
Auto self-registration is not available here - far too many spammers. This forum has many, many backlinks and because of that there is an intense desire among spammers to drop their links here.

Wordpress Themes - WP Forum at BFA » WordPress Themes » Atahualpa 3 Wordpress theme » Center area post/pages »

styling default hr tag


  #1  
Old Apr 11, 2013, 01:35 PM
rainbow
 
13 posts · Apr 2013
I have restyled my default hr tag, and would like to also apply my customized style to the horizontal line that Atahualpa automatically inserts at the end of pages and posts. For example, on this page: http://mihansa.net/also-with-yun-jung-hun I'd like the horizontal line above the Share this: buttons which was inserted automatically by the theme to match the two horizontal lines I inserted manually above the two h5 headings.

I have not been able to find the styling for this line. I know a little html, but no php, and it doesn't seem to be in the obvious files (style.css, css.php).

Can anyone help me identify the element, and compose the code I need to use to style it (hopefully I can do this in html/css inserts)?

Many thanks in advance!
  #2  
Old Apr 11, 2013, 02:00 PM
lmilesw's Avatar
lmilesw
 
10,174 posts · Jul 2009
Central New York State USA
Just use Firebug to determine the selectors.
__________________
~Larry (CNY Web Designs)
This site should be a membership site since it so full of good stuff.
Please consider donating which gives you access to even more good stuff.
  #3  
Old Apr 13, 2013, 02:23 PM
rainbow
 
13 posts · Apr 2013
Easy for you to say! Firebug is NOT a friendly tool for the html novice. However, using the windows element inspector, I was able to determine that the line styling I'm trying to copy is actually a top border on the Share This box. Here's the styling for the box.

div.sharedaddy div.sd-block {
border-top: 1px solid rgba(0, 0, 0, 0.13);
padding: 10px 0px 5px;
margin: 0px;
width: 100% !important;
}

I'm not quite sure how to reframe this in css as a line style. I don't see a color at all (which may explain why it shows up black in FireFox and gray in IE). But the weight is the main thing I want to copy to my HR style. How would I convert that "0.13" to css? 0.13 of what??

You can see the difference between the two lines here:
http://mihansa.net/my-korean-drama-lists/#bottom

I like the line just above the buttons (in FireFox, anyway. Not so much in IE), and I'd like to style my hr to match (yes, globally).
  #4  
Old Apr 13, 2013, 03:26 PM
juggledad's Avatar
juggledad
 
23,655 posts · Mar 2009
OSX 10.11.5 WP 4.x Atahualpa(all) Safari, Firefox, Chrome
RGBA is a CSS3 feature IE8 and lower don't support it. The 'a' is the alpha'
(this was found doing a quick google search using 'css rgba')
  #5  
Old Apr 13, 2013, 05:16 PM
lmilesw's Avatar
lmilesw
 
10,174 posts · Jul 2009
Central New York State USA
The reason I mention Firebug as there is often no "answer" to a particular question and using Firebug to virtually style items is what I do all the time to test styling.

In your case I would just try some gray styling for the hr tag such as
HTML Code:
hr {
color: #ccc;
background-color: #ccc;
height: 1px;
}
I found this example via a Google search for "styling hr tag" and clicked a link that said Styling <hr> with CSS

It is really important, especially for HTML novices, to learn how to search and experiment.

Here is another bit of code to try again determined via Firebug.
HTML Code:
hr {
    height: 1px;
    background: #DBB988;
}
__________________
~Larry (CNY Web Designs)
This site should be a membership site since it so full of good stuff.
Please consider donating which gives you access to even more good stuff.

Last edited by lmilesw; Apr 13, 2013 at 05:49 PM.
  #6  
Old Apr 14, 2013, 09:12 PM
rainbow
 
13 posts · Apr 2013
Yes, I actually tried pretty much that same code (my html skills are good enough for that much), but I couldn't get the line thickness to match - my styled hr line, even at 1 px was heavier than the box border I was trying to match.

I did google line weight, less than 1 px, etc., but everything I found said the line thickness couldn't be less than a px, yet it obviously can, 'cause you can see the border line is thinner than the 1 px hr line.
  #7  
Old Apr 16, 2013, 02:02 PM
lmilesw's Avatar
lmilesw
 
10,174 posts · Jul 2009
Central New York State USA
How about this code?
HTML Code:
hr {
    border-top: 1px solid #DBB988 !important;
}
__________________
~Larry (CNY Web Designs)
This site should be a membership site since it so full of good stuff.
Please consider donating which gives you access to even more good stuff.

Bookmarks

Tags
hr style

Thread Tools Search this Thread
Search this Thread:

Advanced Search
Display Modes


Similar Threads
Thread Thread Starter Forum Replies Last Post
Default CSS (css.php) overriding CSS inserts? crashley1784 Atahualpa 3 Wordpress theme 8 Sep 24, 2012 10:11 PM
Default values for H1, H2, H3, etc. jankph Header configuration & styling 1 May 25, 2011 09:59 AM
Where is the default styling located? Ty_ Header configuration & styling 2 Dec 3, 2009 08:51 AM


All times are GMT -6. The time now is 05:22 PM.


Powered by vBulletin® Copyright ©2000 - 2018, Jelsoft Enterprises Ltd.