Jump to content


Photo
- - - - -

Bottom border on boxes?


Best Answer Danny , 08 October 2013 - 11:14 AM

You can just use the .home class, which will mean that the CSS will only effect Boxes on the homepage.

 

 .home .section-boxes .plgrid {
border-bottom: 1px solid #CCC;
}
Go to the full post


  • Please log in to reply
9 replies to this topic

#1 bobbekaer

bobbekaer

    Advanced Member

  • Members

  • 89 posts
  • Framework Version:2.3.6
  • Country: Country Flag

Posted 08 October 2013 - 08:50 AM

I am finally close to the Finish line on this project :-) The last thing is giving me grey hair! My client designed this page with a HR in the bottom of the page:

 

Please Login or Register to see this Hidden Content

 

I rebuild the site in Pagelines Framework on 

Please Login or Register to see this Hidden Content

 and wanted to add a border to the bottom of the boxes. I tried fx with 

Please Login or Register to see this Hidden Content

#boxes.container.clone_2.section-boxes{
bottom-border: 10px #CCCCCC;
 
}
 

but I can't figure it out... I have tried a lot of combination after using inspect element via Firefox.

 

:-D

 

Bolette



#2 Danny

Danny

    Is Awesome!

  • Moderators
  • 12945 posts
  • LocationManchester, UK
  • Country: Country Flag

Posted 08 October 2013 - 10:27 AM

Hi,

 

It's probably difficult because you have customized the Boxes slightly.
 

What you will need to do first is add some padding to the bottom of the boxes, you have the following code, you can add 30px to it to give you padding at the bottom.

 

Please Login or Register to see this Hidden Content

 

Please Login or Register to see this Hidden Content

 

Then add the following CSS:

Please Login or Register to see this Hidden Content



#3 bobbekaer

bobbekaer

    Advanced Member

  • Members

  • 89 posts
  • Framework Version:2.3.6
  • Country: Country Flag

Posted 08 October 2013 - 11:01 AM

Great Danny

 

That worked. And then I realized I have other boxes on the site -and they should not have the border. Can you please help with the id for the boxes on the homepage? 

 

:-)



#4 Danny

Danny

    Is Awesome!

  • Moderators
  • 12945 posts
  • LocationManchester, UK
  • Country: Country Flag

Posted 08 October 2013 - 11:14 AM   Best Answer

You can just use the .home class, which will mean that the CSS will only effect Boxes on the homepage.

 

Please Login or Register to see this Hidden Content



#5 bobbekaer

bobbekaer

    Advanced Member

  • Members

  • 89 posts
  • Framework Version:2.3.6
  • Country: Country Flag

Posted 08 October 2013 - 11:17 AM

Thank you! I was looking for the clone of the boxes....

 

:-D



#6 Danny

Danny

    Is Awesome!

  • Moderators
  • 12945 posts
  • LocationManchester, UK
  • Country: Country Flag

Posted 08 October 2013 - 12:15 PM

No problem.

 

Also, you could have used the clone class. However, the class isn't unique to the Boxes section, meaning that if you had cloned another set of Boxes elsewhere, such as another page or post, it too may have had the class id and therefore the styling would have effected it.

Thats why the .home class is the better option.



#7 bobbekaer

bobbekaer

    Advanced Member

  • Members

  • 89 posts
  • Framework Version:2.3.6
  • Country: Country Flag

Posted 09 October 2013 - 05:21 AM

But if I wanted to show these boxes on several pages - and in Drag & Drop had to instances of boxes - I guess the smart thing would be to use the clone class?

 

And thanks :-)



#8 Danny

Danny

    Is Awesome!

  • Moderators
  • 12945 posts
  • LocationManchester, UK
  • Country: Country Flag

Posted 09 October 2013 - 11:08 AM

You can use the Clone class. However, the clone class has an numeric ID, this means that your styling would only style that clone. In using the clone class, you would probably require numerous lines of code to target specific boxes. Therefore, imo it would be less hassle to just target the specific boxes you want to have a border bottom on, via the page-id-X, post-id-X, class. These can be found in your body element.

#9 bobbekaer

bobbekaer

    Advanced Member

  • Members

  • 89 posts
  • Framework Version:2.3.6
  • Country: Country Flag

Posted 22 October 2013 - 11:40 AM

Thank you Danny :-) I can understand why this is the better way.



#10 Danny

Danny

    Is Awesome!

  • Moderators
  • 12945 posts
  • LocationManchester, UK
  • Country: Country Flag

Posted 22 October 2013 - 12:11 PM

No problem.