Joomla Templates Club 406,261 posts

[cantabriadeportiva Friend cantabriadeportivaJoin date: June 2011Posts: 86Downloads:0Uploads:13 Thanks: 48 Thanked: 4 times in 1 posts]

#188507

Hi!

I have a very stupid question for you guys… How can I place two columns centered instead three in Our Services page???

This is the code for three columns:

<div class="page-wrap">
<h3 class="page-title">
Our <span class="orange">Services</span></h3>
<div class="col-intro col-left">
<div class="inner">
<img alt="Joomla" border="0" src="images/stories/demo/joomla-logo.png" />
<h4>
Joomla</h4>
<p>
Pellentesque dictumst nibh Nulla dui at urna leo wisi dui Curabitur. Laoreet Nulla et id urna et vitae non tincidunt eros condimentum. Purus metus elit consectetuer est rhoncus vestibulum sociis cursus porta Curabitur.</p>
</div>
</div>
<div class="col-intro col-center">
<div class="inner">
<img alt="Drupal" border="0" src="images/stories/demo/drupal-logo.png" />
<h4>
Drupal</h4>
<p>
Pellentesque dictumst nibh Nulla dui at urna leo wisi dui Curabitur. Laoreet Nulla et id urna et vitae non tincidunt eros condimentum. Purus metus elit consectetuer est rhoncus vestibulum sociis cursus porta Curabitur.</p>
</div>
</div>
<div class="col-intro col-right">
<div class="inner">
<img alt="Wordpress" border="0" src="images/stories/demo/wordpress-logo.png" />
<h4>
Wordpress</h4>
<p>
Pellentesque dictumst nibh Nulla dui at urna leo wisi dui Curabitur. Laoreet Nulla et id urna et vitae non tincidunt eros condimentum. Purus metus elit consectetuer est rhoncus vestibulum sociis cursus porta Curabitur.</p>
</div>
</div>
</div>


Thanks!!!

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

#497121

From code above you can change as follow

Go to Admin site -> Module Manager -> Find “Services” custom html module

+ Custom HTML Script

From


<div class="page-wrap">
<h3 class="page-title">Our <span class="orange">Services</span></h3>
<div class="col-intro col-left">
<div class="inner"><img src="images/stories/demo/joomla-logo.png" border="0" alt="Joomla" />
<h4>Joomla</h4>
<p>Pellentesque dictumst nibh Nulla dui at urna leo wisi dui Curabitur. Laoreet Nulla et id urna et vitae non tincidunt eros condimentum. Purus metus elit consectetuer est rhoncus vestibulum sociis cursus porta Curabitur.</p>
</div>
</div>
<div class="col-intro col-center">
<div class="inner"><img src="images/stories/demo/drupal-logo.png" border="0" alt="Drupal" />
<h4>Drupal</h4>
<p>Pellentesque dictumst nibh Nulla dui at urna leo wisi dui Curabitur. Laoreet Nulla et id urna et vitae non tincidunt eros condimentum. Purus metus elit consectetuer est rhoncus vestibulum sociis cursus porta Curabitur.</p>
</div>
</div>
<div class="col-intro col-right">
<div class="inner"><img src="images/stories/demo/wordpress-logo.png" border="0" alt="Wordpress" />
<h4>Wordpress</h4>
<p>Pellentesque dictumst nibh Nulla dui at urna leo wisi dui Curabitur. Laoreet Nulla et id urna et vitae non tincidunt eros condimentum. Purus metus elit consectetuer est rhoncus vestibulum sociis cursus porta Curabitur.</p>
</div>
</div>
</div>


change to


<div class="page-wrap">
<h3 class="page-title">Our <span class="orange">Services</span></h3>
<div class="col-intro col-left">
<div class="inner"><img src="images/stories/demo/joomla-logo.png" border="0" alt="Joomla" />
<h4>Joomla</h4>
<p>Pellentesque dictumst nibh Nulla dui at urna leo wisi dui Curabitur. Laoreet Nulla et id urna et vitae non tincidunt eros condimentum. Purus metus elit consectetuer est rhoncus vestibulum sociis cursus porta Curabitur.</p>
</div>
</div>
<div class="col-intro col-center">
<div class="inner"><img src="images/stories/demo/drupal-logo.png" border="0" alt="Drupal" />
<h4>Drupal</h4>
<p>Pellentesque dictumst nibh Nulla dui at urna leo wisi dui Curabitur. Laoreet Nulla et id urna et vitae non tincidunt eros condimentum. Purus metus elit consectetuer est rhoncus vestibulum sociis cursus porta Curabitur.</p>
</div>
</div>
<div class="col-intro col-right">
<div class="inner"><img src="images/stories/demo/wordpress-logo.png" border="0" alt="Wordpress" />
<h4>Wordpress</h4>
<p>Pellentesque dictumst nibh Nulla dui at urna leo wisi dui Curabitur. Laoreet Nulla et id urna et vitae non tincidunt eros condimentum. Purus metus elit consectetuer est rhoncus vestibulum sociis cursus porta Curabitur.</p>
</div>
</div>
</div>


+ Css script

Open templates/ja_cloris/css/template.css file

From


.col-intro {
float: left;
font-family: 'BitstreamVeraSansRoman';
text-align: center;
width: 33.3%;
}


Change


.col-intro {
float: left;
font-family: 'BitstreamVeraSansRoman';
text-align: center;
width: 50%;
}


Remember to clear cache from Admin area after changing

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

1. cantabriadeportiva

[cantabriadeportiva Friend cantabriadeportivaJoin date: June 2011Posts: 86Downloads:0Uploads:13 Thanks: 48 Thanked: 4 times in 1 posts]

#497174

Thanks! I think both ‘Services’ codes are the same, but it works.

[Author]

Posts