Solved Templates

Some tweaks to the row containing logo-left and logo-right in Gazette template

Asked by Sean Carney 3 years ago Last activity 3 years ago

I may be asking too much but am wondering how I could add some padding between two modules in the logo-left position. Here is a page where you can see the custom module with the text "Jewish Life" to the right of the logo-left main menu: https://test1.theraliv.org/jewish-life

I placed an extra module at the top of all of my category and subcategory pages in the logo-left position to display the name of the category people are visiting at the top of the browser next to the logo-left mainmenu.

But, I could use some help adding padding to move the modules to the right about five pixels.

I want to add something like

margin-left: 5px;

To the following nine modules

Jewish Life
<div id="mod-custom982" class="mod-custom custom">
<h3><a title="Jewish Life" href="/jewish-life">Jewish Life</a></h3></div>

L'Chaim
<div id="mod-custom996" class="mod-custom custom">
<h3><a title="L'Chaim" href="/lchaim">L'Chaim</a></h3></div>

Israel
<div id="mod-custom997" class="mod-custom custom">
<h3><a title="Israel" href="/israel">Israel</a></h3></div>

Torah
<div id="mod-custom998" class="mod-custom custom">
<h3><a title="Torah" href="/torah">Torah</a></h3></div>

Stories
<div id="mod-custom999" class="mod-custom custom">
<h3><a title="Stories" href="/stories">Stories</a></h3></div>

God's World
<div id="mod-custom1000" class="mod-custom custom">
<h3><a title="God's World" href="/gods-world">God's World</a></h3></div>

Video
<div id="mod-custom1001" class="mod-custom custom">
<h3><a title="Video" href="/video">Video</a></h3></div>

Espanol
<div id="mod-custom1022" class="mod-custom custom">
<h3><a title="Español" href="/es">Español</a></h3></div>

Russian
<div id="mod-custom1023" class="mod-custom custom">
<h3><a title="Russian" href="/ru">Russian</a></h3></div>

Sean Carney

Accepted answer

Marked as the solution
Mehtaz Afsana Borsha Staff
3 years ago

Hi

Thanks for contacting us. Use this custom CSS

div#mod-custom982 {
    padding-left: 10px !important;
}

Path towards custom CSS: Extensions>Templates>Styles> Click on your current default template name then choose Template Options. Then find custom CSS within the custom code.

-Regards.

5 more replies

Oldest first Newest first Most helpful
Sean Carney Asked this
3 years ago · edited

https://drive.google.com/file/d/1kgVnzQlVTadAoZ_g03rKWDKL10gqGgyQ/view?usp=share_link

This is what I put in my custom.css file that did not work but I thought it would:

/* Add left pad to Category Label */
.itemid-982  h3 {padding-left: 10px;}
.itemid-996  h3 {padding-left: 10px;}
.itemid-997  h3 {padding-left: 10px;}
.itemid-998  h3 {padding-left: 10px;}
.itemid-999  h3 {padding-left: 10px;}
.itemid-1000  h3 {padding-left: 10px;}
.itemid-1001  h3 {padding-left: 10px;}
.itemid-1022  h3 {padding-left: 10px;}
.itemid-1023  h3 {padding-left: 10px;}
Sean Carney Asked this
3 years ago

Thank you. Thank you. Thank you. That worked perfectly.

Sean

Sean Carney Asked this
3 years ago

I just submitted trust pilot feedback as Sean Carney.

Interestingly I don't submit many recommendations. In fact there are only three. One of the other ones is recommending JoomShaper.

Sean

Mehtaz Afsana Borsha Staff
3 years ago

Thanks a lot Sean. Happy new year.

Log in to reply.