Shift the menu bar up to the same line with Logo

Jan 2011 Joomla Templates
Hi guys,

I want to shift my main menu to the right and it at the same line with the logo. Please help me! Thanks.

My website url is: natest.cloudaccess.net
User avatar
normanaudio
Fresh Boarder
Fresh Boarder

Fri Aug 30, 2013 7:55 am


Hi

Please add this to site's css:

Code: Select all
#gkMainNav {
    left: 300px;
    margin: 0;
    position: absolute;
    top: 73px;
}
---------------------------------------------------------------------------------------------------
Mailing me details please ALWAYS put a link to post as a topic!!! gk.teitbite@gmail.com

Want to hire me for custom job ? Check my portfolio first: http://www.teitbite.com/
User avatar
teitbite
Moderator
Moderator

Sun Sep 01, 2013 7:13 pm


Hi Teitbite,

Can you help me to remove the following 2 gaps ? Thank you very much for your help.

Image
User avatar
normanaudio
Fresh Boarder
Fresh Boarder

Mon Sep 02, 2013 8:28 am


By the way, can you guide me how to remove "HOME" button ? Thank you.
User avatar
normanaudio
Fresh Boarder
Fresh Boarder

Mon Sep 02, 2013 10:09 am


Hi

Gap removal:

Code: Select all
#gkPageTop h1 {
    height: 60px;
    white-space: normal;
}

#gkMainNav {
    top: 13px;
}


to remove "Home" element use this code:

Code: Select all
div.gk-menu > ul.level0 > li.first {
    display: none;
}
---------------------------------------------------------------------------------------------------
Mailing me details please ALWAYS put a link to post as a topic!!! gk.teitbite@gmail.com

Want to hire me for custom job ? Check my portfolio first: http://www.teitbite.com/
User avatar
teitbite
Moderator
Moderator

Mon Sep 02, 2013 1:45 pm


Hi,

Sorry for disturbing you again. I want to ask 2 questions relating to my website.

First, How can i increase the size for my logo ?

Second, How can i remove the gap of the page when i browse it on ipad.

Thank you very much.

Image
User avatar
normanaudio
Fresh Boarder
Fresh Boarder

Fri Sep 06, 2013 4:58 pm


Hi

You can make logo bigger with this code:

Code: Select all
h1#gkLogo a img {
    width: 232px;
}
---------------------------------------------------------------------------------------------------
Mailing me details please ALWAYS put a link to post as a topic!!! gk.teitbite@gmail.com

Want to hire me for custom job ? Check my portfolio first: http://www.teitbite.com/
User avatar
teitbite
Moderator
Moderator

Fri Sep 06, 2013 6:17 pm


Hi

Sorry, I've clicked Submit by accident :)

Replace the code to center menu to this one:

Code: Select all
#gkMainNav {
    left: 50%;
    margin: 0 0 0 -100px;
    position: absolute;
    top: 85px;
    width: 400px !important;
}


This will fix the iPad gap issue.

Greets
---------------------------------------------------------------------------------------------------
Mailing me details please ALWAYS put a link to post as a topic!!! gk.teitbite@gmail.com

Want to hire me for custom job ? Check my portfolio first: http://www.teitbite.com/
User avatar
teitbite
Moderator
Moderator

Fri Sep 06, 2013 6:32 pm


Hi teitbite,

Thank you for your help so much. I want to learn building a website.

I just have 1 more issue on my homepage. I want to remove the gap that showing on the image below. Hope that you can help me.



Thank you

Image
User avatar
normanaudio
Fresh Boarder
Fresh Boarder

Sun Sep 08, 2013 4:35 pm


Hi

This gap is a what remains from social buttons :) If You do not need it please add this code to css:

Code: Select all
#gkSocialAPI {
display: none;
}
---------------------------------------------------------------------------------------------------
Mailing me details please ALWAYS put a link to post as a topic!!! gk.teitbite@gmail.com

Want to hire me for custom job ? Check my portfolio first: http://www.teitbite.com/
User avatar
teitbite
Moderator
Moderator

Sun Sep 08, 2013 8:40 pm


Hi teitbite,

Thank you very much for your help. Can you teach me how to put the dotted lines to fit the content of my pages. And how can i delete it if i want. Thank you.

Image
User avatar
normanaudio
Fresh Boarder
Fresh Boarder

Tue Sep 10, 2013 5:17 am


Hi

Css code responsible for this line looks like this:

Code: Select all
#mainPage .box > div, #mainPage .box_menu > div, #mainPage .box_text > div {
    border: 1px dashed #D3CBB9;
}


so to remove this just set a "none" value to this class for border.
---------------------------------------------------------------------------------------------------
Mailing me details please ALWAYS put a link to post as a topic!!! gk.teitbite@gmail.com

Want to hire me for custom job ? Check my portfolio first: http://www.teitbite.com/
User avatar
teitbite
Moderator
Moderator

Tue Sep 10, 2013 1:51 pm


Hi,

Thank you for your reply. I have tried the code you gave me but i cannot remove the dotted lines. Is there anything wrong ?

Another issue i want to do with the site is that i want to remove the brown square box when i selected a specific section in menubar. Can you teach me how to remove it ? Thank you very much.

Image
User avatar
normanaudio
Fresh Boarder
Fresh Boarder

Thu Sep 12, 2013 6:45 am


Hi

I have just show You which code is responsible for adding lines. A code to remove it is:

Code: Select all
#mainPage .box > div, #mainPage .box_menu > div, #mainPage .box_text > div {
    border: medium none !important;
}


Unfortunately I do not understand Your second part of question. What brows box You have in mind ?
---------------------------------------------------------------------------------------------------
Mailing me details please ALWAYS put a link to post as a topic!!! gk.teitbite@gmail.com

Want to hire me for custom job ? Check my portfolio first: http://www.teitbite.com/
User avatar
teitbite
Moderator
Moderator

Fri Sep 13, 2013 3:05 am


Hi,

My brown square box is on the menubar which is pointing bellow in the image. Thank you for your help.

Image
User avatar
normanaudio
Fresh Boarder
Fresh Boarder

Sat Sep 14, 2013 2:43 am


Btw, After applying your code, the dotted lines is removed on the top and below parts of my website. But my mainbody still remain the dotted lines. Please let me know if i can do anything. Thank you.
User avatar
normanaudio
Fresh Boarder
Fresh Boarder

Sat Sep 14, 2013 2:47 am


Hi

To remove background from under the active menu element please use this code:

Code: Select all
#gkMenu ul.level0 > li.active > a, div#gkDropMain ul > li.active > a {
    background: none repeat scroll 0 0 transparent;
}


border from mainbody part can be removed with this code:

Code: Select all
#gkMainbodyWrap {
    border: medium none;
}
---------------------------------------------------------------------------------------------------
Mailing me details please ALWAYS put a link to post as a topic!!! gk.teitbite@gmail.com

Want to hire me for custom job ? Check my portfolio first: http://www.teitbite.com/
User avatar
teitbite
Moderator
Moderator

Sat Sep 14, 2013 2:51 am



Return to Coffe
cron