Jump to content

Archived

This topic is now archived and is closed to further replies.

ketri

Pl NextBox adds 'pl-section-pad' even when I check "Disable DMS padding classes"

Recommended Posts

ketri    7
ketri

Hi!

I'd like to add stuff to my website without any paddings or margins (I'll custom code them if I need it).
I've tried using MediaBox and NextBox but they always add some paddings.
There is a:

<div class="pl-section-pad fix">

which adds the padding. 
Is there a but or how can I add media boxes and nextboxes without having to remove the padding with Less.

Thank you very much!

Share this post


Link to post
Share on other sites
greenfly    230
greenfly

Pl

 

as simple as changing 

 

.pl-section-pad {
  margin-bottom:1em;
  padding:8px;
}
 
to 

.pl-section-pad {
  margin:0;
  padding: 0;
}

To target a specific Media box, NextBox or any other section for that matter - Drill down to the Section ID with Firebug or your browser inspection tools

 

for example - this giant logo in the next screenshot is displayed via a media box - http://screencast.com/t/j04SQYrJT

 

if we want to target just that section we prefix the CSS with the section ID - in this instance  #mediaboxukc8r4i

 

Help with ID and Class selectors can be found here http://www.w3schools.com/css/css_selectors.asp

 

also

 

a post i think helps also is here http://forum.pagelines.com/topic/32857-removing-padding-from-header-and-other-sections/

 

and Danny's comment here 

 

 

Hi,

 

What I recommend is you use if you aren't already Google Chromes web dev tools, when inspecting any element in Chromes dev tools, padding is displayed as green and margin is displayed as a shade of orange. This should help you identify the class you want to target.

 

Then you can manipulate the sites padding/margin using chromes dev tools, then all you want to do then is add your changes to your custom CSS.

 

For example, let's say you want to remove the padding from the masthead section, you code would look something like this (please remember this is an example):

 

.section-masthead .content-pad { padding: 0px; }

 

 

 

  • Like 1

The answer to many issues can be found by searching in the forum before posting as someone else  may very well have had the same problem before you have.  Also, reading the documentation can help you gain a good understanding of how everything works. 

 

Please do not send me private messages. Occam's razor - The principle states "Keep things simple!"

Share this post


Link to post
Share on other sites
ketri    7
ketri

Thanks!

That's the method I've been using up until this point, just writing CSS and targeting the elements I want to have more or less padding.

What I meant was to ask what is the "Disable DMS padding classes" -checkbox in NextBox supposed to do? 
I assumed (apparently wrong) that it would simply remove all paddings around the Nextbox and it's content. 

Thank you very much!

Share this post


Link to post
Share on other sites

  • Similar Content

    • lbhansen
      By lbhansen+
      I am slowly getting closer to something I like for the general appearance of my site. What's currently nagging me is trying to remove the top and bottom padding/margin from the image in the header. It seems that I've done what I want with the menu but there was dead space above the image and between the image and menu.
      Trying out padding and margin settings, I got something that came close to what I want but saw odd behavior along the way. Changing either the top or bottom padding to 0 (from blank), removed all padding from the top and sides but left a small band between the image and menu.
      Setting all eight padding and margin settings to 0 removed all except the band between image and menu. (But it seems that entering 0 in only the top or bottom padding option is all that was needed.)
      So, heading into the twilight zone, I changed the bottom margin to -1. That removed the band but allowed the menu to slightly overlap the image. AND, narrowing the browser, or viewing on a phone, caused the band to reappear.
      Perhaps there's also a problem with the menu but I don't see it.
      So that's where it stands at the moment: http://756.a44.myftpupload.com 
      I seems to me that if there is a default padding value, setting it to 0 should be all that's needed to get the two sections to meet perfectly on any device/browser width.
    • Perry
      By Perry+
      Hello There, 
      I am working with Platform 5 and have run into an unnerving problem. I am trying to position my clients picture along the bottom of the container, so that it sits right on the bottom. After a good hour of googling and messing with the CSS I figured I would ask the question here. Below is my screenshot displaying my problem. I will need to do this frequently in the future. 
      My Problem Image
      Unlike in DMS, when I add a margin to an embed or image box it simply makes the container larger while keeping the padding, I cannot have any padding or any space whatsoever on the bottom of my clients image.  Is there a way to remove all padding from the container so I can have this work across screen sizes? If not is there anyway to position an element directly at the bottom of another element in Platform 5? This seems like a basic feature and was easily attainable within DMS. 
      I cannot create an image combining all these elements as it will not scale well on mobile and will make my clients logo unreadable and her face incredibly small. 
       
      Thank you for any help,
      Perry
    • chamois_blanc
      By chamois_blanc+
      Hello,
      I am a bit confused about the usage of percentages for section padding/margin settings in the PL5 UI. Percentages don't scale well for mobile devices (especially in height), so those settings are pretty much useless. Case in point, the defaults are expressed in rem units, not percentages:
      .pl-sn-pad { padding: 1rem; ... } Why force the user to use percentages in the PL5 section UI when it would have been as easy to let the user specify the unit?
    • casseysdesigns
      By casseysdesigns+
      In the past I would use nextbox for this task. However, Platform 5 does not have nextbox. I will do my best to describe what I am trying to do.
      I am creating a template for coaches, each product has its own link but they all share a common coach id. I want to set up the templates with the links for each product with a variable for the coach id so that I can change the coach id for all the links on the site by just changing the value of the variable $coachId. To do this I'll need to do something like the following...
      <a href="salesite.com/productcodes/referringRepId=<?= $coachId ?>" target="_blank">Product Purchase Link</a> Is it possible to do this with Platform 5?
    • sheenook
      By sheenook+
      Hello
      I would like to disable mega nav on mobile, i can't find how to do it, can you help me ?
×