3

I am using Blueprint CSS framework and I have the following code for para in my screen.css file

p {margin:0 0 1.5em;}
.left {float:left !important;}
 p .left {margin:1.5em 1.5em 1.5em 0;padding:0;}
.right {float:right !important;}
p .right {margin:1.5em 0 1.5em 1.5em;padding:0;}

Now because of the above code(I guess) when I use para in my website I get the following formatting:

para One
     para two
     para three  

INSTEAD of

para One
para two
para three

Could you please tell me how to fix the problem.

Thanks in Advance :)

black_belt
  • 6,601
  • 36
  • 121
  • 185
  • can you please give the example of your code on jsfiddle.net – khurram May 12 '12 at 05:45
  • 1
    THanks khurram for your reply. I pasted some of my codes on jsfiddle and interestingly it worked okay there. May be because I couldn't paste all the codes. But if you see this blueprint's official demo template(http://blueprintcss.org/tests/parts/sample.html) which is actually built using Blueprint CSS framework, you would see that the problem also exists there. please check the source code of that template for details.(Press Ctrl+U) – black_belt May 12 '12 at 08:20
  • 1
    There probably *is* no problem, this is working as intended. In the `screen.css` file there's a rule `p + p { text-indent: 2em; }` which is meant to... well err... indent each `p` that follows another `p`. – Jeroen May 12 '12 at 09:41
  • @Jeroen could you please post this as an answer so that I can mark it as correct. I have deleted the screen.css and its working just the way I wanted. :) – black_belt May 12 '12 at 17:15
  • @black_belt okidoki done that, thx :) and glad to be of help – Jeroen May 12 '12 at 20:14

2 Answers2

1

The screen.css file contains a rule that creates this effect:

p + p {
    text-indent: 2em;
}

This means that every p following another p will be indented by 2em.

If you remove that (or the entire file of course :D) then the paragraphs won't indent anymore.

Jeroen
  • 60,696
  • 40
  • 206
  • 339
0

in the tutorial above you pasted the Link, there is class used at the second para that is

.<div class="span-15 prepend-1 colborder">

just remove the class "prepend-1" from that div, because there is padding-left in it.

.prepend-1
{
padding-left:40px;
}

sorry for bad english!

khurram
  • 946
  • 1
  • 13
  • 34
  • Thanks for your reply. I removed the prepend-1 but still it didn't work, but however I have managed to got the result I wanted by removing the blueprint/plugins/fancy-type/screen.css – black_belt May 12 '12 at 17:19