Jump to content

Archived

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

nfp1900

Reducing size of a textbox

Recommended Posts

nfp1900    29
nfp1900

I have a text box with a simple html title: <h3><span style="color: #009089;">Our People</span></h3><hr/>

 
placed in the text content area. But there's a lot of space underneath which I can't remove. If I check with firebug it was showing this. 
 
<section class="pl-section span12 offset0 section-textbox" data-clone="pe2gap" data-sid="textbox" data-object="PageLinesTextBox" id="textboxpe2gap"><div class="pl-section-pad fix"><div style="" class="textbox-wrap pl-animation   animation-loaded"><div class="hentry"><h3><span style="color: #009089;">Our People</span></h3>
<hr>
 

The  data-clone="pe2gap" leads me to think it's duplicating something. Any ideas?

 

Link to page - it's the people section: nicholaspealldesign1.com.gridhosted.co.uk/home2/

  • Like 2

Share this post


Link to post
Share on other sites
nfp1900    29
nfp1900

Anyone got an opinion on this....?

Share this post


Link to post
Share on other sites
Rob    547
Rob

Nick, did you check the section's min-height setting when you edit the section or any parent section?

 

Also, I'm noticing an errant <br> after the <hr> tag.

 

See this:

<div class="pl-sortable-column pl-sortable-area editor-row">
<div class="row grid-row">
<section id="textboxpe2gap" class="pl-section span12 offset0 section-textbox" data-clone="pe2gap" data-sid="textbox" data-object="PageLinesTextBox">
<div class="pl-section-pad fix">
<div class="textbox-wrap pl-animation animation-loaded" style="">
<strong>
<h3>
<hr>
</strong>
<br>   <--HERE'S THE ERRANT BREAK
<div class="hentry"></div>
</div>
</div>
</section>
</div>

Former PageLines Moderator, Food Expert and Raconteur

Share this post


Link to post
Share on other sites
nfp1900    29
nfp1900

Rob

 

 

Thanks for looking at this. The <br> tag isn't visible to me - but I dragged in a new textbox to start over. It seems adding the <h> tag, in this case <h3></h3> and then the line underneath <hr> in the title section is causing the text box to double in size. It also seemed to be the case when I added this in the text content area. 

 

Adding 1px of padding to the option area also didn't make any difference. 

 

If I strip out the html and use the font size option then it's a big improvement but then I have to restyle the textbox with the correct font /colour - maybe this is the best way to do it?

Share this post


Link to post
Share on other sites
Danny    1,327
Danny

Hi,

 

I'm don't actually understand what space you're referring to. If you mean the white space beneath your second textbox which has the Our People in a greenish color, then that space is created by your sidebar. The Content Area runs alongside your Sidebar, if you do not have a lot of content, but do in our sidebar, your sidebar will cause white space in your content area because the sidebar is slow long.

 

Is this what you mean ?


Please search our forums, before posting!

Share this post


Link to post
Share on other sites
nfp1900    29
nfp1900

So you're saying that content in separate columns is somehow connected?

 

To the left is an 8/12 column with text sections then a 4/12 column with the twitter feed in a widgetizer. 

 

I don't see how the twitter feed would cause space to appear in a textbox that is halfway - from my experience the difference in content height appears at the bottom of the respective column. 

 

What I'm trying to determine is why html code causes the textbox to bloat without reason and if using a class to style the copy is more effective than using html tags

Share this post


Link to post
Share on other sites
Rob    547
Rob

Nick, you should really update to 1.0.2.

 

I suspect the H3 tag is adding that <br>. How about we try some custom CSS.  I know everyone loves H tags, but they can be pre-formatted in ways that don't always work well for everyone.

 

Would you consider using a unique class and eliminating both the h3 and hr tags?


Former PageLines Moderator, Food Expert and Raconteur

Share this post


Link to post
Share on other sites
CoachJo    3
CoachJo

There are a lot of active topics asking this same thing.  What is the default padding on text boxes and why does it seem to be so much?

Share this post


Link to post
Share on other sites
nfp1900    29
nfp1900

sorry for the delay...was on hols. 

 

Those h tags do cause serious bloating of the text boxes, used a class and CSS instead which is slightly better. Wished the padding would be minimal by default. 

Share this post


Link to post
Share on other sites
Rob    547
Rob

Hi,

 

The padding is significant to allow non-skilled users to design a website without coding.  Experienced designers, such as yourselves should be familiar with tools such as Firebug or Chrome's Inspection Tools and are capable of finding and adjusting the code, since it's quite evident.

 

Between the padding setting (I use 0 personally), and the ability to create a custom class on the fly, I can make each section look exactly as I desire. It's much, much easier than most would think.


Former PageLines Moderator, Food Expert and Raconteur

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?
    • balfred1345
      By balfred1345
      Hi,
      I've got a client on a DMS ver. 1.1.9.1 site. Using WP 4.5.2.
      The site is clean from malware. And I've replicated the below problem with all plugins off except for DMS Pro Tools
      Here's the page: http://choralartsensemble.org/support/sponsors/
      When a textbox or column with textbox on the page are deleted, upon save and refresh one or more textboxes in the header and footer loses its content. This is a repeatable occurrence. 
      Can you please tell me how to fix this so it does not happen again? 
    • John Olsson
      By John Olsson+
      I have a problem with the regular textbox in pl5, in this case, the text goes in that container, but it will hide som of the text, as if the container itself won't fit?
      Is this some kind of bug or have I done something stupid, never happend before with pl5 doh, can I do something smart about it?
      Version: Version 5.0.108
      Look here: www.gastronova.co56.se

×