Can't remove borders/padding/margins from Highline2 maincontent

soren9000dk

I am building a Joomla site that has not yet been uploaded to a webhost. For this project I use the Joomlabamboo Highline2 template.

I have made the following settings to the maincontent of the Highline2 template but as you can see on the attached screenshot the borders/padding/margins has still not been removed.

Extensions-->Templates-->Styles--> Highline2 template -->Design-->Maincontent (12) --> Style -->

Row style:
Row Padding = No padding
Row Margin = No margin
Row Border = none

Container Style:
Container Padding = No padding
Container Margin = No margin
Container Border = none
Make container fullwidth = "on"

The funny thing is that if the Grid1 posision is used with the same map module in stead of the Maincontent posision, then the borders does not show up using these settings - it makes them dissapear which is perfect. Un fortunately the map module MUST be placed in the Maincontent posison to work the right way.

How can the black border (1) get removed from top and sides of the maincontent area and how can the border (2) shown in purple get removed from top and bottom of the maincontent area?

pavit

Hi soren9000dk

Since from our demo it is not possible to replicate your settings, would be better if you will publish your website on a public host from where we can access and see your settings and provide a solution to your issue.

Regards

soren9000dk

Okay but i don't have a web host at the moment. Could you please (in the meantime) tell me where to find the right css file for this maincontent posision of the template and maby some tags for removal of the borders/margins/padding?

pavit

Hi soren9000dk

You can use the custom.css file to add your customizations, if i correctly understood you can try with the

.row-padding {
padding:10px 4%;
}

again if we do not see your website it is like drive blinded in the dark

Regards

soren9000dk

pavit

Hi pavit

I have finally created a webhost for your purppose of inspecting my site.
The problem is not quite as I thought.

I have installed the component "Hotspot Pro".

Basically the problem is that Hotspot cannot be featured in the offcanvas menu because it is a component. To solve that I have made a hidden menu and created a Custom HTML module to be published to the GRID1 area of the template.

Problem is that the module position attached to the featured menu item has to be different from the module positions attached to the other menu items, otherwise it will be shown twice (bellow) in the same page.
As standard Hotspot is published to the MAINCONTENT area of the template and that is the reason that I publish the featured menu to the GRID1 area. In this way it is possible to make all the other menu items published to the MAINCONTENT area without being shown twice. So far so good.

The description above just explains why I use two different template positions for the same Hotspot component which leads to the main problem concerning this template.

When you visit the website you see the map view because you hit the featured menu which is hidden. Everything looks fine as it should.

Problem is when choosing any other menu items (bellow the featured menu item) that is published to any other areas except GRID1, then the content will be embedded by borders/margins/padding as shown on the previously screenshot.

It makes no different which module position to be used.

Problem simplified:

OFFCANVAS MENU
MENU ITEM 1 (featured) --> GRID1 (all looks fine)
MENU ITEM 2 --> MAINCONTENT (embedded) PLEASE FIX!
MENU ITEM 3 --> WHATEVER (embedded) PLEASE FIX!

I hope for any solutions to remove these borders/margins/padding.

teitbite

soren9000dk Hi. I've just visited Your site and none of the pages appears with the border as shown on Your screenshot. Can You please tell me the url to the page where I will actually be able to see those purple paddings. Is it connected to some specific device or browser.

soren9000dk

Okay, now I have colored the issues.

Joomla --> Extensions --> Templates --> Styles --> Highline2 template --> Design --> MAINCONTENT --> Style -->Container style: PINK

Joomla --> Extensions --> Templates --> Styles --> Highline2 template --> Design --> GRID1 --> Style -->Container style: GREEN

Please choose some of the menu items frontend to see what I mean.
Thats the borders/margin/padding to be removed - but how?

aman204

soren9000dk Hi

Upon reviewing, The specific functionality from Zengrid framework is working fine as envisaged. Ref: Screenshot which exhibits background-color and padding appending as selected for Grid-1 container

soren9000dk

aman204
Thats not the issue. The padding has just been colored to show you which padding thats not possible to remove - its already disabled inside the GRID1-container panel and the MAINCONTENT-container panel - but still visible! Thats the problem.
Please take a look at these screenshots:

aman204

soren9000dk Kindly check now. Ref: Screenshot

The margin/padding was being added due to tag getting wrapped around ... tags in specific custom module assigned which has been removed after editing the HTML output

Kindly ensure to clear your browser cache if changes dont reflect.

soren9000dk

aman204
It sounds like you've found the main reason but it's not possible to remove this tag getting wrapped around ... tags in specific custom module assigned. So this means that you can not use Custom HTML modules with this template without having these borders/padding surrounded or is there a solution to this?

aman204

soren9000dk Hi

As apparently seen, The specific section is appearing now as envisaged by you with ... tags in custom html module.

Kindly let us know if you have been able to find workaround around this specific query so as to mark the thread as resolved or need further assistance on the same 🙂

soren9000dk

I have to admit that I don't understand what exactly do you mean.

When I go to Custom HTML module --> tab: Module --> tab: Code and delete these ... tags and press save, they are automatically applied again.

Your explanation is not very clear to me. Can you please try to explain how to remove this borders as I do not understand what I am supposed to do?

aman204

soren9000dk You may check now. Ref: Screenshot

Have added inline style with zero margin and padding for p tags

soren9000dk

aman204
I appreciate your support and hope that you are not getting mad at me.

I have added the mentioned inline style with zero margin and padding for p tags to the Custom HTML modules GRID1 and GRID5, but it just working on GRID1 and removes only the top padding.

{hotspotsanywhere}

If you go to menu item "Map view 2 (GRID1)" you'll see there are still pink padding at the bottom.
If you go to menu item "Map view 3 (GRID5)" you'll see there are still green padding at the top and both sides.

Is something missing or is it necessary to add more codes and if so which ones?

aman204

soren9000dk Is something missing or is it necessary to add more codes and if so which ones?

Kindly check now

Instead of inline style, Have added this to custom.css file which would enable to cover other sections with grouped CSS :

#grid1 .moduletable .custom p,.zen-container .zen-row #midCol{margin:0 !important;padding:0 !important;}

Kindly ensure to clear your browser cache if changes dont reflect.

soren9000dk

aman204
Brilliant! It looks like it works! Thank you for helping and your patience with me :-) Now I can go on with my design. Have a nice day :-)