Content Formating using gkcolleft & gkcolright

Rate this topic: Evaluations: 1, 1.00 on the average.Evaluations: 1, 1.00 on the average.Evaluations: 1, 1.00 on the average.Evaluations: 1, 1.00 on the average.Evaluations: 1, 1.00 on the average.Evaluations: 1, 1.00 on the average.1.00 out of 6 based on 1 vote(s)
GK User
Mon May 25, 2015 1:24 pm
Reply with quote
Report this post
hi,

while i use this code, the content appears quite low when used in blog article, can i narrow down the gap.

Result: http://www.bankcircle.in/instant-hdfc-bank-personal-loan-online

Code:
Code: Select all
<div id="pagewrap">
<div class="gkColumnLeft">
<p data-scroll-reveal="enter left and move 50px over 0.4s after 0.4s" style="text-align: justify;">We believe customer satisfaction &amp; quality assurance is a key to success. Therefore, we value our customer and their needs as they are only reason behind our existence. To achieve customer's trust, we focus on analyzing deals available with leading providers across Banks.</p>
</div>
<div class="gkColumnRight">
<figure data-scroll-reveal="enter from the bottom and move 50px over 0.2s after 0.2s"><span style="color: #e57d3c;"><i class="fa fa-umbrella fa-3x pull-left fa-border"></i></span>
<h5>Best Interest Rates</h5>
<br />Our team comprises of Qualified and Professional Experts in Financial Market. We would help you buy, rather than push to sell a product.
<p><a href="instant-personal-loan" class="readon">Read More</a></p>
</figure>
<figure data-scroll-reveal="enter from the bottom and move 50px over 0.4s after 0.2s"><span style="color: #e57d3c;"><i class="fa fa-tint fa-3x pull-left fa-border"></i></span>
<h5>Eligibility Calculator</h5>
<br />In broad-spectrum, using a loan eligibility calculator will connote that you are better equipped to deal with the crucial calculations while taking credit.
<p><a href="income-eligibility-calculator" class="readon">Read More</a></p>
</figure>
</div>
<div>
<figure data-scroll-reveal="enter from the bottom and move 50px over 0.4s after 0.2s">
<h5>Benefits</h5>
<p class="gkInfo1">One Stop Shop for All Financial Needs. Get the Best Product at the Best Price. Save Precious Time. Respecting your Privacy. <a href="about" class="readon">Read More</a></p>
<p></p>
</figure>
</div>
</div>
User avatar
Junior Boarder

GK User
Mon May 25, 2015 3:38 pm
Reply with quote
Report this post
Could you please mark the problematic space on a screenshot?
User avatar
Moderator

GK User
Fri May 29, 2015 1:04 pm
Reply with quote
Report this post
Hi,

Pls find attached the screenshot. I've also marked the area as box where this padding/ gap is there.

Untitled.png
User avatar
Junior Boarder

GK User
Mon Jun 01, 2015 3:46 pm
Reply with quote
Report this post
Could you please disable css compression for the time being?
User avatar
Moderator

GK User
Tue Jun 02, 2015 7:21 pm
Reply with quote
Report this post
Hi,

Disabled CSS Compression.
User avatar
Junior Boarder

GK User
Fri Jun 05, 2015 3:10 pm
Reply with quote
Report this post
Please edit: /templates/gk_john/css/override.css and add at its end:
Code: Select all
article header {
  margin-bottom: 10px !important;
}
.gkColumnLeft, .gkColumnRight {
  padding: 10px 0 !important;
}

Remember to enable "CSS override" in template settings - advanced section.

Ps. Please check if that change doesn't "damage" anything else.
User avatar
Moderator

GK User
Sat Jun 13, 2015 12:00 pm
Reply with quote
Report this post
Hi,

Pls find what happens if CSS override is enabled. The header margins goes wrong.

before.png


after.png


Link to chk : http://www.bankcircle.in/apply-home-loan

css/override.css content is :

Code: Select all
/*
#------------------------------------------------------------------------
# John S. - March Joomla! template (for Joomla 2.5)
#
# Copyright (C) 2007-2014 Gavick.com. All Rights Reserved.
# License: Copyrighted Commercial Software
# Website: http://www.gavick.com
# Support: [email protected]
*/

/* Here you can include your override CSS styles */
#gkContentWrapper
{
padding: 0 0 0 0;
}
#select

{
   max-width: 93% !important;
  width: 94%;
 
}
.box1
{
   max-width: 93% !important;
  width: 94%;
 
}

div#discuss-wrapper .markItUp .markitup-bold a {
  background-image: url('../../../../../media/com_easydiscuss/styles/../images/markitup/bold.png');
}

div#discuss-wrapper .markItUp .markitup-italic a {
  background-image: url('../../../../../media/com_easydiscuss/styles/../images/markitup/italic.png');
}

div#discuss-wrapper .markItUp .markitup-underline a {
  background-image: url('../../../../../media/com_easydiscuss/styles/../images/markitup/underline.png');
}

div#discuss-wrapper .markItUp .markitup-url a {
  background-image: url('../../../../../media/com_easydiscuss/styles/../images/markitup/link.png');
}

div#discuss-wrapper .markItUp .markitup-picture a {
  background-image: url('../../../../../media/com_easydiscuss/styles/../images/markitup/picture.png');
}

div#discuss-wrapper .markItUp .markitup-video a {
  background-image: url('../../../../../media/com_easydiscuss/styles/../images/markitup/video.png');
}

div#discuss-wrapper .markItUp .markitup-bullet a {
  background-image: url('../../../../../media/com_easydiscuss/styles/../images/markitup/list-bullet.png');
}

div#discuss-wrapper .markItUp .markitup-numeric a {
  background-image: url('../../../../../media/com_easydiscuss/styles/../images/markitup/list-numeric.png');
}

div#discuss-wrapper .markItUp .markitup-list a {
  background-image: url('../../../../../media/com_easydiscuss/styles/../images/markitup/list-item.png');
}

div#discuss-wrapper .markItUp .markitup-quote a {
  background-image: url('../../../../../media/com_easydiscuss/styles/../images/markitup/quotes.png');
}

div#discuss-wrapper .markItUp .markitup-code a {
  background-image: url('../../../../../media/com_easydiscuss/styles/../images/markitup/code.png');
}

div#discuss-wrapper .markItUp .markitup-happy a {
  background-image: url('../../../../../media/com_easydiscuss/styles/../images/markitup/emoticon-happy.png');
}

div#discuss-wrapper .markItUp .markitup-smile a {
  background-image: url('../../../../../media/com_easydiscuss/styles/../images/markitup/emoticon-smile.png');
}

div#discuss-wrapper .markItUp .markitup-surprised a {
  background-image: url('../../../../../media/com_easydiscuss/styles/../images/markitup/emoticon-surprised.png');
}

div#discuss-wrapper .markItUp .markitup-tongue a {
  background-image: url('../../../../../media/com_easydiscuss/styles/../images/markitup/emoticon-tongue.png');
}

div#discuss-wrapper .markItUp .markitup-unhappy a {
  background-image: url('../../../../../media/com_easydiscuss/styles/../images/markitup/emoticon-unhappy.png');
}

div#discuss-wrapper .markItUp .markitup-wink a {
  background-image: url('../../../../../media/com_easydiscuss/styles/../images/markitup/emoticon-wink.png');
}
article header {
  margin-bottom: 10px !important;
}
.gkColumnLeft, .gkColumnRight {
  padding: 10px 0 !important;
}
User avatar
Junior Boarder

GK User
Mon Jun 15, 2015 9:03 am
Reply with quote
Report this post
override.css was created probably by you so you should know why you have putted there a change - one of the previous makes this difference.
User avatar
Moderator


cron