Paragraph spacing and <ul> indentation

I searched this forum for this issue in Sporter, but could not find a solution.

Paragraph spacing is such that no extra space is added at the bottom. To resolve the issue, I add blank paragraphs between the content paragraphs. I am not an expert with CSS, but every place I have tried to add padding to the bottom has resulted in spacing increases throughout the entire template.

I am interested in simply adding spacing below paragraphs in the full text areas. Help?

Additionally, there is no padding/indent for lists. They simply align to the left. How can I fix this issue without impacting the menus, which are also based on <UL>

http://www.macnseitz.com/new/

Thanks in advance for your help.

I try insert in addon.css this code:

Code: Select all

p{
  margin-top: 10px;
  margin-bottom: 10px;
}

But this code change the poll module in my frontpage.

If I change the title of the poll module to normal and size 100%, fixed my problems. But I don't know how to fix it.

You can see in my site: http://sjnew.digitaldinamica.com.br. It's under construction.

Thanks for the suggestion. Since I use only K2 for my articles, I just ended up adding the following to my override.css to adjust H2 and p spacing

Code: Select all

.itemFullText h2 { padding-bottom:20px; }
.itemFullText p {padding-bottom:20px;}


I hope this is not an indication of how support at Gavick works. Two days and not a peep.

Hi

This is not a template matter but lack of basic css knowledge. Sorry to tell this but I'm not here to teach You but to help with problems with our products.

I can advice to run throught http://www.w3schools.com/css/default.asp I've done it long time ago and It's really good for start.

Also the developer's hammer: Firebug. It's a Firefox plugin which enables to make changes to the look of the style live.

Interesting you would say this is not a template matter, when the problem is incredibly basic AND included in the template-specific k2.css file you include with your download AS PART OF THE TEMPLATE.

Selling a template, while claiming it supports K2 when it really doesn't, is a bit misleading. Having made no allowances for paragraph breaks IS a problem with the template's design. If you cannot see that, then YOU might want to study up on Typography. I suggest you start here:

http://en.wikipedia.org/wiki/Typography

I do not expect you to teach me CSS. I do expect a reasonable level of support for which I paid good money.

While there may be a simpler way to approach this oversight, here is what my override.css looks like so far:

/* HERE YOU CAN PUT YOUR OWN CSS RULES */
.gk-menu ul.level0 div.childcontent ul {margin: 4px;padding: 10px 0;}
.itemFullText h2 { padding-bottom:20px; }
.itemFullText p {padding-bottom:20px;}
p.gk_info1 {padding-bottom:5px;}}
.itemFullText ul {
line-height: 1.5em;
text-indent: 2px;
list-style-position: outside;
list-style-type: disc;
padding-left: 36px;
margin: 2px;
}


/* Typography Paragraphs */
p.gk_info2 {padding-bottom:5px;}
p.gk_info3 {padding-bottom:5px;}
p.gk_info4 {padding-bottom:5px;}
p.gk_tips1 {padding-bottom:5px;}
p.gk_tips2 {padding-bottom:5px;}
p.gk_tips3 {padding-bottom:5px;}
p.gk_tips4 {padding-bottom:5px;}
p.gk_warning1 {padding-bottom:5px;}
p.gk_warning2 {padding-bottom:5px;}
p.gk_warning3 {padding-bottom:5px;}
p.gk_warning4 {padding-bottom:5px;
p.gk_audio {padding-bottom:5px;}
p.gk_webcam {padding-bottom:5px;}
p.gk_email {padding-bottom:5px;}
p.gk_creditcard {padding-bottom:5px;}
p.gk_feed {padding-bottom:5px;}
p.gk_help {padding-bottom:5px;}
p.gk_images {padding-bottom:5px;}
p.gk_lock {padding-bottom:5px;}
p.gk_printer {padding-bottom:5px;}
p.gk_report {padding-bottom:5px;}
p.gk_script {padding-bottom:5px;}
p.gk_time {padding-bottom:5px;}
p.gk_user {padding-bottom:5px;}
p.gk_world {padding-bottom:5px;}
p.gk_cart {padding-bottom:5px;}
p.gk_cd {padding-bottom:5px;}
p.gk_chart_bar {padding-bottom:5px;}
p.gk_chart_line {padding-bottom:5px;}
p.gk_chart_pie {padding-bottom:5px;}
p.gk_clock {padding-bottom:5px;}
p.gk_cog {padding-bottom:5px;}
p.gk_coins {padding-bottom:5px;}
p.gk_compress {padding-bottom:5px;}
p.gk_computer {padding-bottom:5px;}
p.gk_cross {padding-bottom:5px;}
p.gk_disk {padding-bottom:5px;}
p.gk_error {padding-bottom:5px;}
p.gk_exclamation {padding-bottom:5px;}
p.gk_film {padding-bottom:5px;}
p.gk_folder {padding-bottom:5px;}
p.gk_group {padding-bottom:5px;}
p.gk_heart {padding-bottom:5px;}
p.gk_house {padding-bottom:5px;}
p.gk_image {padding-bottom:5px;}
p.gk_information {padding-bottom:5px;}
p.gk_magnifier {padding-bottom:5px;}
p.gk_money {padding-bottom:5px;}
p.gk_new {padding-bottom:5px;}
p.gk_note {padding-bottom:5px;}
p.gk_page {padding-bottom:5px;}
p.gk_page_white {padding-bottom:5px;}
p.gk_plugin {padding-bottom:5px;}
p.gk_accept {padding-bottom:5px;}
p.gk_add {padding-bottom:5px;}
p.gk_camera {padding-bottom:5px;}
p.gk_brick {padding-bottom:5px;}
p.gk_box {padding-bottom:5px;}
p.gk_calendar {padding-bottom:5px;}

Hi

Thanks for the link I really like learning new stuff. I'm a programmer so really doesn't know much about design. But I believe that the thing You are explaining as a problem is a way designer made it so if You do not like it there always is an option to change it.

Please show me the part of the text You are refering to. The best option would be to see it on Your site.

You will not see the paragraph spacing issue on my site, because I have implemented the above referenced changes to override.css.

However, you can see it on the demo on Gavick.com at:
http://demo.gavick.com/joomla15/sep2010 ... Itemid=103

The first two paragraphs show a distinct separation, because of css values for itemintrotext. However, subsequent paragraphs show no delineation / additional spacing to set them apart.

If that page was a Joomla page, rather than K2, the paragraphs would have the following css applied:

.article-content p {
margin-bottom: 10px;
margin-left: 0;
margin-right: 0;
margin-top: 10px;
}


.itemFullText, for K2 articles, has no settings.


On the issue of <ul> or <ol>, there are no settings other than those requiring special coding through GK Typography. By default, there is not even the standing indentation let alone bullets.

Hi

I've send it to developers.

Thanks. I know the focus is on new templates and converting old ones to 1.6, but hopefully they will incorporate the fix in the upgrade.

Hi

Well, you are right. It's a small issue and it's easy to adjust.
Just add this line on ks.css file:

Code: Select all

div#k2Container .itemIntroText p,div#k2Container .itemFullText p {margin-bottom: 12px}
div#k2Container .itemIntroText p:last-child {margin-bottom: 0}


The first two paragraphs show a distinct separation, because of css values for itemintrotext. However, subsequent paragraphs show no delineation / additional spacing to set them apart.

That's because there's 2 div's there and both are separated with bottom margin.

Cheers

I understood the two div's. Was just trying to explain the issue so it was clear.

Thanks for the css code. I try to stay away from the primary css files and have already fixed the issue in override.css. I am css-dumb enough that a quirk in a future update could take me hours to figure out!

Take Care

hey guys after adding this code to the override.css file my ul still doesnt indent. what am i doing wrong?

Note that the css they provided only addresses the paragraph spacing issue, not the UL problem.

Also, in order to use override.css, be sure the turn it "on" in the template setup. (It is in the Dev Mode area of the template settings.)

no i actually agree with u and would rather not touch the primary css so i just copied and pasted your code into the override file and the new menu appearence does work(like it better but for some reason the itemfull text overide code is not recognized.

i do have override.css turned on in the template setup.

Hi

Please show me an example page with this problem.

here u go,

http://dardoselectronicos.com/index.php ... Itemid=122