Not Solved Create Top Link Border
#1
Not Solved
How would I go about creating a top link separator like this:
[Image: CQSRQyC.png]

The furthest I have gotten was here:
[Image: cJ532KN.png]

How do I get the border/separator to expand the whole height? I've tried a few different things but they don't expand. Here is my code:

#logo ul.top_links {
 background: #ff8a00 url(images/cleanorange/thead.png) repeat-x;
color: #ecebeb;
padding: 7px;
clear: both;
font-weight: bold;
text-align: left;
margin: 20px 5px 0 0;
}

#logo ul.top_links a{
color: #ecebeb;
display: block;
padding-right: 15px;
border-right: 1px solid #ccc;
}

Thanks.
Reply
#2
Not Solved
css edits are always easy/faster to fix if provided with the url..
We can't help everyone, but everyone can help someone - Ronald Reagan
Did you know? Your question has already been answered. But you haven't searched it yet.
Don’t  Forget to “Mark as Solved” after the fix
Reply
#3
Not Solved
(2016-02-23, 06:04 AM)mmadhankumar Wrote: css edits are always easy/faster to fix if provided with the url..

Here is my test board URL: http://destinyboard.net/
Reply
#4
Not Solved
in global.css of your theme remove "padding: 7px;" for "#logo ul.top_links" and then change "line-height: 16px;" into "line-height: 32px;" for "#header ul.menu li a".. save the changes and hard refresh the forum (Ctrl+F5) to see the changes...
We can't help everyone, but everyone can help someone - Ronald Reagan
Did you know? Your question has already been answered. But you haven't searched it yet.
Don’t  Forget to “Mark as Solved” after the fix
Reply
#5
Not Solved
(2016-02-23, 06:18 PM)mmadhankumar Wrote: in global.css of your theme remove "padding: 7px;" for "#logo ul.top_links" and then change "line-height: 16px;" into "line-height: 32px;" for "#header ul.menu li a".. save the changes and hard refresh the forum (Ctrl+F5) to see the changes...

Thank you very much. That did it!

Now just one more thing. Since the edit, how do I even out the spacing here? As you can see, the left side of 'Home' is much smaller than the rest. I'd like to have both right and left sides even.

[Image: zEh7cjq.png]
Reply
#6
Not Solved
add this to global.css to fix that...

#logo ul.top_links li:first-child {
    padding-left: 11px;
}
We can't help everyone, but everyone can help someone - Ronald Reagan
Did you know? Your question has already been answered. But you haven't searched it yet.
Don’t  Forget to “Mark as Solved” after the fix
Reply
#7
Not Solved
(2016-02-24, 08:25 AM)mmadhankumar Wrote: add this to global.css to fix that...

#logo ul.top_links li:first-child {
    padding-left: 11px;
}

Thank you very much for all of your help!
Reply


Forum Jump:


Users browsing this thread: 1 Guest(s)