Joomla Templates Club 406,261 posts

[mkfloresca Friend mkflorescaJoin date: November 2014Posts: 57Downloads:11Uploads:15 Thanks: 16]

#204605

Is it possible to have the image link on the “ENGLISH” menu with colored background (attached photo) to fill the entire box where it is located? The info tip shows it can be as big as 128px by 53px. Is this possible to do on the main menu without affecting the layout of the other main menu items?

Thanks.
Karla

---

Attachments:

1. 

[Ninja Lead Moderator Ninja LeadJoin date: November 2014Posts: 16064Downloads:310Uploads:2864 Thanks: 341 Thanked: 3854 times in 3563 posts]

#562953

In this case, I would like to check the problem directly on your site. Please post URL of your site here.

[mkfloresca Friend mkflorescaJoin date: November 2014Posts: 57Downloads:11Uploads:15 Thanks: 16]

#563142

<em>@Ninja Lead 463217 wrote:</em><blockquote>In this case, I would like to check the problem directly on your site. Please post URL of your site here.</blockquote>

Hi NinjaLead

I will PM the info to you as my test site is restricted at the moment.

Thank you.
Karla

[Ninja Lead Moderator Ninja LeadJoin date: November 2014Posts: 16064Downloads:310Uploads:2864 Thanks: 341 Thanked: 3854 times in 3563 posts]

#563194

I only view URL of your site from front-end and not back-end site. But you can solve your request with my solution below

Open templates/ja_university_t3/css/custom.css file and add new rule


.navbar-default .navbar-nav > li > a:last-child img {
background-size: 100%;
width: 200px;
}

.navbar-default .navbar-nav > li > a:last-child {
padding: 0px;
}


Let me know if it helps

[mkfloresca Friend mkflorescaJoin date: November 2014Posts: 57Downloads:11Uploads:15 Thanks: 16]

#564080

<em>@Ninja Lead 463575 wrote:</em><blockquote>I only view URL of your site from front-end and not back-end site. But you can solve your request with my solution below

Open templates/ja_university_t3/css/custom.css file and add new rule


.navbar-default .navbar-nav > li > a:last-child img {
background-size: 100%;
width: 200px;
}

.navbar-default .navbar-nav > li > a:last-child {
padding: 0px;
}


Let me know if it helps</blockquote>

HI Ninja Lead,

I did apply the css customization you provided above, but the image is still not occupying the entire space. If I change the padding, all the other menus are affected. If you don’t mind checking my page out, I will PM you with info.

Thanks,
Karla

[Ninja Lead Moderator Ninja LeadJoin date: November 2014Posts: 16064Downloads:310Uploads:2864 Thanks: 341 Thanked: 3854 times in 3563 posts]

#564169

Hi Karla,

I fixed the problem directly on your site with the solution below

+ Go to English page, German page and add megamenu-image css class

+ Open templates/ja_university_t3/local/css/themes/blue/custom.css file and add new rule


/*-- megamenu image -- */
a.megamenu-image {
padding: 0px !important;
}

a.megamenu-image img {
height: 50px !important;
background-size: cover !important;
}


Let me know if it helps

Regards

---

Attachments:

1. 

1 user says Thank You to Ninja Lead for this useful post

1. mkfloresca

[mkfloresca Friend mkflorescaJoin date: November 2014Posts: 57Downloads:11Uploads:15 Thanks: 16]

#564847

Hi Ninja Lead,
This is exactly what I was trying to work on.
I greatly appreciate your assistance!

Karla

[Author]

Posts