Joomla Templates Club 406,261 posts

[osseo Friend osseoJoin date: February 2012Posts: 205Downloads:16Uploads:26 Thanks: 69]

#194637

Hi,

In my “ja tabs” module (same as the “Why pick us” module from the JA Nex demo site), sometimes when I’m in “1st tab”, it will show part of the content from the “2nd tab” and then after I click on the “right arrow” to switch to 2nd tab, part of the content from my 3rd tab will show at the end of it… I’m guess this happens because the “width” of my template is “flexible” depends on the user’s browser.

I’m wondering if I can set a “fixed width” for the ja-tab module to prevent this from happening?

Thank you,
Emily

[Saguaros Moderator SaguarosJoin date: September 2014Posts: 31405Downloads:237Uploads:471 Thanks: 845 Thanked: 5346 times in 4964 posts]

#522031

Hi Emily,

Please try to keep JA Tabs plugin up-to-date and post your site’s URL here so that I can have a look then check it for you.

[osseo Friend osseoJoin date: February 2012Posts: 205Downloads:16Uploads:26 Thanks: 69]

#522080

Hi Saguaros,

Here is my site url: http://jlamp.district279.org/
and the module is up to date.

Once I made the ja-nex template a “fixed width” and it’s not doing then it appears to be ok. If it happens again I’ll capture a screenshot to show you what I’m talking about. However, I’ll still like to be able to change the width of the tab module so it can be better aligned with other modules.

Questions:

1. When I add width=”700″ in the module that’s in the “content-mass-bottom” as follow:
{jatabs type=”modules” module=”ja-tabs” position=”top” width=”700″ mouseType=”click” animType=”animMoveHor” } {/jatabs}
I only change the width within the tabs to 700px, the “box” is still much wider. Is it something I can add to the css to force the width?

2. Also, the “youtube module” that’s on the right position is not align with the ja-tabs module, how can I make those two module align straight on the top?

Thanks so much for your help,
Emily

[Saguaros Moderator SaguarosJoin date: September 2014Posts: 31405Downloads:237Uploads:471 Thanks: 845 Thanked: 5346 times in 4964 posts]

#522177

I try to add the same width value into the sample template at my end but that issue doesn’t happen. Could you PM me admin login info of your site, I will have a closer look.

[osseo Friend osseoJoin date: February 2012Posts: 205Downloads:16Uploads:26 Thanks: 69]

#522215

Just PM you. I just need help to figure out how to adjust the width so both ja-tabs and the youtube module on the right can fit nicely on the page and the tabs module can align with the box in sl-2 position.

Thanks for your help again.
Emily

[osseo Friend osseoJoin date: February 2012Posts: 205Downloads:16Uploads:26 Thanks: 69]

#522241

Hi Saguaros,

Just want you to know I did try changing the width setting under the ja-tabs plug-in, but as you can see from my screenshot. It only change the width within the content (tab) boxes, but it didn’t change the overall width in that module box position “content-mass-bottom”.

Then I also add a “special width=60” in the ja nex template layout xml file:
<block name=”content-mass-bottom” special=”left” specialwidth=”60″>content-mass-bottom</block>
But that still didn’t change anything for me.

Please tell me know what else I have missed.
I assume if I figure out how to adjust the content-mass-bottom or the ja-tabs module. I can follow the same steps to adjust for other module as well? For example the module that’s in top sl1-3? And also how to make my YouTube module box to be “top aligned”? (Please refer to my screenshot attached)

Thanks!
Emily

---

Attachments:

1. 

[chavan Friend chavanJoin date: October 2014Posts: 4612Downloads:0Uploads:110 Thanked: 1440 times in 1290 posts]

#522493

Hi,

I have fixed the layout issue

Added this css code and made this code to work only on home page

#ja-mainbody{

width:71% !important;
}

#ja-right{
width:28.5% !important;
}

Now you can add the right side Video Module and check the layout.

2 users say Thank You to chavan for this useful post

1. Saguaros
2. osseo

[osseo Friend osseoJoin date: February 2012Posts: 205Downloads:16Uploads:26 Thanks: 69]

#522546

Hi Chavan,

I just PM you the info, but the “video module” got change back somehow and it’s not align with the top anymore 🙁 Please tell me how you fix that (where to add the codes?) so I can fix it myself?

By any chance you have a solution to change the width in the “sl-3” column?

Thanks!
Emily

[phong nam Friend phong namJoin date: May 2015Posts: 3779Downloads:1Uploads:587 Thanks: 499 Thanked: 974 times in 888 posts]

#522567

Hi Emily,

I am sorry for the late response on your PM. I did open and i forget to reply soon. I just want to say that Chavan is a qualified supporter and your issues will be fixed soon with his assistance.

For the existing issue of module’s padding (Content-mass-bottom and Youtube video), you can try to follow these steps:

– Go to Home menu item >> Page Display Options >> put the text “home” to Additional class option. Make sure you leave a space before the text.

– Go to Youtube module >> Module class suffix >> put the text “video“. Make sure a space is left before it.

– Try to put below override css rules into the end of template.css file:

.ja-moduletable.video {
padding: 0 10px 0 0 !important;
margin-top: -40px !important;
}

.home #ja-mainbody {
margin-top: -70px;
}

Adjust the padding value until you get perfect and clear JAT3 cache then.

1 user says Thank You to phong nam for this useful post

1. osseo

[osseo Friend osseoJoin date: February 2012Posts: 205Downloads:16Uploads:26 Thanks: 69]

#522632

Hi Leo,

Thank you for your reply, that’s not a problem, Chavan did helped me out yesterday. However, I couldn’t find out where he added the following two css rules. I know it’s not in the template.css and not in the template/ja_nex/html either.

#ja-mainbody{ width:71% !important;}#ja-right{ width:28.5% !important;}
Therefore, unless Chavan can share with me where he added those two css rules, or if you can tell. I will follow your steps to create the override class in the template.css and change the width within there.

Lastly, if you can take a look at the screenshot I’ve attached earlier, can you please tell me how I can create a new rule for the modules that’s in the sl-3 position in order to adjust the total width for that column? Do I have to find each module ID and create special css override rule in the template.css? I’m sorry I was having trouble identify the right container name from firebug css code.

Thanks again!
Emily

[chavan Friend chavanJoin date: October 2014Posts: 4612Downloads:0Uploads:110 Thanked: 1440 times in 1290 posts]

#522646

Hi,

I have added a new Module called Custom css into the your system. There I have added the suggested css code.

1 user says Thank You to chavan for this useful post

1. osseo

[Author]

Posts