Jump to content

Archived

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

ketri

How should horizontally resizing the main column <div class="pl-content nested-section-area ui-resizable"> work?

Recommended Posts

ketri    7
ketri

Hello!

In my page I have the main area where I can drag and drop stuff. This area is resizeable so I can drag from the right border and make it narrower or wider. It adds new width to <div class="pl-content nested-section-area ui-resizable"> .

What is this for? How should it work? Why is it there? 
When I save it won't save the new width. And also it's set a width and not max-width so it's no longer responsive.

Is it for testing a good width so you can code it as Less by yourself or what I'm not getting here?

Thank you very much!

Share this post


Link to post
Share on other sites
James B    436
James B

Hi there, I'm not sure I'm following 100% what you're saying.

 

Do you mean the width of the main page editor, like this - http://screencast.com/t/kBXL081OB

 

If so that allows you to set the width for the content area of the page. So you can drag the page in/out, save and publish and it will reset the maximum content width to that value.

 

If you're not referring to that area could you please screencast the area you're looking at for us.


Kindly search the forum and read the documentation before posting. It will help you resolve many issues.

For CSS help be sure to check out W3Schools first and be sure to download FireBug for FireFox for troubleshooting.

James B

Share this post


Link to post
Share on other sites
ketri    7
ketri

Hi there, I'm not sure I'm following 100% what you're saying.

 

Do you mean the width of the main page editor, like this - http://screencast.com/t/kBXL081OB

 

If so that allows you to set the width for the content area of the page. So you can drag the page in/out, save and publish and it will reset the maximum content width to that value.

 

If you're not referring to that area could you please screencast the area you're looking at for us.

Yes, that's exactly what I'm referring to and trying to do =) 
But for me 
1. The header, the content and the footer all have their own width that and changing one changes just one
2. When I resize from left border, it does not stay centered buy adjust the width in a weird way.
3. When I try to save the new width and refresh, the width has not changed. It's the same it was originally before editing.

Are there some settings that should be adjusted for this to work?

Share this post


Link to post
Share on other sites
ketri    7
ketri

I've now solved this issue. Bacause of a bug in Facebook Comments that prevents it from being responsive and breaks the layout, I had a js hack that also affected Pagelines. 
So I'll enable the script when I'm certain of my page width. 
I wonder what in the script conflicts with DMS..?

Thank you!

 

Edited by danny - In future please use the pastie service:

 

http://forum.pagelines.com/pst/p/26-tmbneb/

Share this post


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

Thanks for informing us the issue has been resolved. In regards to what is causing the conflict, I have no idea unfortunately, JS isn't my forte, did you receive any error in your browsers console?


Please search our forums, before posting!

Share this post


Link to post
Share on other sites
ketri    7
ketri

No...
I wonder what causes this. The classes it should be affectin seem quite facebook-specific and should not interfere..hmm

Share this post


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

DMS runs fine without your included fix, therefore you will want to contact the author of that responsive fix, as this isn't DMS related.


Please search our forums, before posting!

Share this post


Link to post
Share on other sites

  • Similar Content

    • terrykiwi83
      By terrykiwi83
      Hi there,
       
      I just have a quick question that I hope can be easily answered. Basically we are using the DMS 2.1.9.3 Framework and have 'activated' the revslider on our site. The current dimensions of the revslider are 2000x800 which is way to big for our site. My question is, how can I resize it so it fits with the rest of the site (From the logo to the end of the contact text would be an ideal size), is there a setting somewhere that I haven't discovered yet? 
       
      The site in question is: http://megatron.homelinux.com/arataki/
       
      Thanks in advance :)
       
      Terry
    • JimP
      By JimP
      Hi there,
      Here is my website; http://dwellloyalty.com
       
      I found this post on resizing my navigation logo to larger than 29px http://forum.pagelines.com/topic/29977-resizing-logo-and-centering-columns/#entry207602
       
      So I placed this code in my custom CSS
      .section-navi .navi-container { height: 150px; padding: 7px; } But nothing seemed to happen...
       
      Any ideas on how to increase the size from 29px?  http://dwellloyalty.wpengine.com/wp-content/uploads/2015/02/Dwell-Loyalty-log-cropped437x2041.png
       
      Thank you - Jim
       
    • margie
      By margie
      Hi All-
       
      I have a quickslider at the top of my page with mediaboxes below.  When I resize the screen, both images reduce in size to a certain point.  When the screen looks to be about the size of an iPad, the mediabox images revert to a larger size as they stack on top of one another, while the quickslider image continues to decrease in size.  Is there a way to make the mediabox images shrink with the same aspect ratio as the quickslider image?  Ideally, I would like all images to continue to get smaller as the device gets smaller.
       
      Thanks so much for your assistance.
    • margie
      By margie
      Hi-
       
      I have the Quickslider at the top of my pages with Mediaboxes and Textboxes below in the content area.  When I view the site on an iPhone, the image in the Quickslider adjust to a much smaller size but the images in the mediaboxes do not.  They shrink as I am dragging the screen (when viewing on a laptop) to a certain extent and then they pop back to a larger size when I reach the width of say, an iPad.  The Quickslider image just keeps shrinking so I'm left with this little image at the top and the mediabox images bigger underneath.  Is there a way to adjust the size of the mediaboxes so they change size commensurate with the Quickslider images?
       
      I have tried modifying the following css thinking they would have the right affect but unfortunately, nothing happened:
       
      .section-mediabox img {
      max-width: 100%-I changed to 88%;
      }
       
      Do the mediaboxes resizability depend on the following from the content: 
      <div class="pl-content ui-resizable">
           body.display-full .pl-content
      Any assistance is greatly appreciated.
       
    • margie
      By margie
      Hi-
       
      I have the Quickslider at the top of my pages with Mediaboxes and Textboxes below in the content area.  When I view the site on an iPhone, the image in the Quickslider adjust to a much smaller size but the images in the mediaboxes do not.  They shrink as I am dragging the screen (when viewing on a laptop) to a certain extent and then they pop back to a larger size when I reach the width of say, an iPad.  The Quickslider image just keeps shrinking so I'm left with this little image at the top and the mediabox images bigger underneath.  Is there a way to adjust the size of the mediaboxes so they change size commensurate with the Quickslider images?
       
      I have tried modifying the following css thinking they would have the right affect but unfortunately, nothing happened:
       
      .section-mediabox img {
      max-width: 100%-I changed to 88%;
      }
       
      Do the mediaboxes resizability depend on the following from the content: 
      <div class="pl-content ui-resizable">
           body.display-full .pl-content
      Any assistance is greatly appreciated.
       
×