MyBB Community Forums
Positioning Logo and Top Links [DarkFusion] - Printable Version

+- MyBB Community Forums (https://community.mybb.com)
+-- Forum: Extensions (https://community.mybb.com/forum-201.html)
+--- Forum: Themes (https://community.mybb.com/forum-103.html)
+---- Forum: Theme Support (https://community.mybb.com/forum-10.html)
+---- Thread: Positioning Logo and Top Links [DarkFusion] (/thread-105190.html)

Pages: 1 2


RE: Positioning Logo and Top Links [DarkFusion] - HybridForum - 2011-10-13

(2011-10-12, 02:32 PM)ranjani Wrote: try this for logo in global.css AND hard refresh your forum page (use CTRL + F5 a couple of times)
.logo {
margin: 40px auto 0;
} 

AND if you need the menu links to be moved to left then you have to change
<div class="header_right">
<div class="menu">

to

<div class="header_left">
<div class="menu">
Thanks the logo part worked perfectly!
But there was a small issue with the second part concerning the menus:
This is how it currently looks and the green part is where I'd like the toplinks to be, please advise.
[Image: jx03yJZr6VrkP.png]

PS. Also I appreciate you're having some problems on your end, so take your time!


RE: Positioning Logo and Top Links [DarkFusion] - ranjani - 2011-10-14

^ for the menu class in global.css , you can use margin-top : -60px;

.menu{
margin-top: -60px;
/* other attributes */
}



RE: Positioning Logo and Top Links [DarkFusion] - HybridForum - 2011-10-15

edit: I really hoped I wouldn't need any extra help but just a little thing:
[Image: ix8kGQFIiuU7s.png]

For the toplinks I've tried:
.topmenu a:link {
	padding: 5px 15px 5px 15px;
        color: #ccc;
        text-decoration: none;
}
I changed it to 0,10,0,10 didn't effect anything.

For the header_right I moved it to above menu but that just made the image linked to the toplinks, I tried below it but then I couldn't move it to its desired place highlighted in darker blue in the image using global.css
I changed it to:
.header_right {
	background: url(images/darkfusion/style/header_right.png) top left no-repeat;
	height: 54px;
        width: 550px;
        margin: auto auto
        padding-top: -100px;
        padding-right: 20px;
        float: right;
}
Margin wasn't there before I edited it.


Also I made a small edit to #container to adapt to the forum size its shown in arrows.
#container {
	background: #101010;
        border: 1px solid #2a2a2a;
	width: 90%;
	color: #808080;
	>>>>>>margin: 30px auto;<<<<<<
        padding: 20px;
	text-align: left;
	-moz-border-radius: 15px;
	-webkit-border-radius: 15px;
}
Thank you for all your help Mr Ranjani, as soon as my website goes live I will place you in the credits! Because without your help I simply would have been baffled.
It was a pleasure being your student and I hope to see you around this forum!
Don't be offended because I made this invisible, I did this just to make the above question clearer, I'll put this back as soon as I know you've read the query.





RE: Positioning Logo and Top Links [DarkFusion] - ranjani - 2011-10-16

.menu {margin-left: -20px;} should work for moving the menu links to the left

for the .header_right also you can use margin-top instead of the padding-top


RE: Positioning Logo and Top Links [DarkFusion] - HybridForum - 2011-10-17

Alright fantastic, I've got the menu sorted and the header_right in the right place!
I'm editing the header slightly graphically to sort out a problem and I'll report back!


RE: Positioning Logo and Top Links [DarkFusion] - HybridForum - 2011-10-19

Hmm, one last thing:
[Image: WZOFW.png]
Do you see how the header_right image is slightly overlapping the .css toplink, how can I make it so that the "Help" menu link is over the header image?