Liferay custom layout issue

[10年前 に Ashish Sawant によって更新されました。]

Hi I am a newbie and exploring Liferay for my project.
I am trying to create a layout for my application and for that I have made changes .tpl file.

Following are my .tpl file entries.

<div id="content-wrapper">
<div id="layout-grid">
<div id="first-div" style="color:black;width:20%">
$processor.processColumn("column-1")
</div>
<div class="second-div" style="color:black;width:40%">
$processor.processColumn("column-2")
</div>
<div class="third-div" style="color:black;width:40%">
$processor.processColumn("column-3")
</div>
</div>
</div>


When I check the layout in Liferay I notice that the columns created are vertical.

This is only file I have changed before deploying the layout.
Searched a loot on google but there seems to be not hint abt the issue.
Also I am trying to create columns in a row with unequal heights.
Is that possible.

Please help me here.

Regards,
Ashish Sawant

[10年前 に Ryan Schuhler によって更新されました。]

With your given code you would need to use css to float your columns, or display them inline-block. If you are using 6.2 you can look at some existing .tpl files in portal to see how they utilize bootstrap to deal with this and make it responsive.

[10年前 に Ashish Sawant によって更新されました。]

Hi Ryan,

Thanks for the quick reply.
That was very much helpful and I have created my very own first custom layout.

Cheers,
Ashish