Jump to content


Photo
- - - - -

How can I align p tag in the content?


  • Please log in to reply
3 replies to this topic

#1 switzo

switzo

    Newbie

  • Members
  • 4 posts
  • Country: Country Flag

Posted 02 January 2013 - 04:21 PM

Hi,

 

I have made borders around the blog posts on my website. Now I need to align the <p> tag to the right to ensure that the content moves 10 pixels to the right. ( You can see that if you have clicked on a post ) I have used firebug to find the selector I need, but if I change the settings in custom css, nothing happens. Could somebody please tell me which selector I need to change?

 

Thanks,

Hans

 

Please Login or Register to see this Hidden Content

 

 



#2 catrina

catrina

    Advocate

  • Members
  • 12345 posts
  • LocationCalifornia
  • Country: Country Flag

Posted 02 January 2013 - 04:55 PM

Instead of adding left padding to the p tag, you need to add it to this selector:

Please Login or Register to see this Hidden Content

You'll need to use the left padding property: www.w3schools.com/css/css_padding.asp



#3 switzo

switzo

    Newbie

  • Members
  • 4 posts
  • Country: Country Flag

Posted 03 January 2013 - 05:29 PM

Hi,

 

Thank you so much. I have used this code and it's working perfect 

 

#page .post-excerpt {
padding: 10px 10px 10px 10px;
}

 

Could you please explain to me, because I don't understand, how do you know that you need that selector? I have used firebug to find the selector I thought I needed. I came up with  <aside class="post-excerpt">. How do you know that you need the ID #page? Could you please explain it to me?

 

I also cannot find the selectors I need to change the position of "read full article". When I read the full post, the content also doesn't align 10 px to the right. I think I need another selector, but I can't find the one I need.

 

Thanks,

Hans



#4 catrina

catrina

    Advocate

  • Members
  • 12345 posts
  • LocationCalifornia
  • Country: Country Flag

Posted 03 January 2013 - 06:25 PM

The selector #page is actually some kind of little code that PL moderators discovered was needed in the CSS in order for the code to work (if #page isn't added to the beginning, then the CSS won't change because the selector isn't specific enough).

 

The "read full article" selector is actually:

Please Login or Register to see this Hidden Content

If you look inside the <a href> tag, you'll see that it has the class: continue_reading_link