Jump to content

Archived

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

rmaxsg

How to remove space between 2 Column Horizontal?

Recommended Posts

rmaxsg    7
rmaxsg

How to remove space  between 2 Column Horizontal? 

 

Here the Image have space between them

Image

 

This is Remove the space between the 2 column

 

Image

 

Thank you for any kind of advice

 

 

Share this post


Link to post
Share on other sites
tsalstrand    8
tsalstrand

Really what you are wanting to do is remove the gutters between columns.   That is done with margin and padding.

 

Without looking at your actual site, I believe this is what you want:

 

body .pl-area .pl-section .pl-section > .pl-section-pad { padding: 0px;}

.editor-row > [class*="span"] {margin-left: 0px;}

Drop that into your custom CSS and it should be good.  If you have further problems, please link to your site.

Share this post


Link to post
Share on other sites
rmaxsg    7
rmaxsg

Thank you so much SteveS for your input. your code works amazing.  but i don't want just in editor. i want live view as well.

 

i using locahost now. maybe tomorrow i will try deploy to live. before that may i know is there, any other CSS code for me to try?

 

sorry for the poor English.

Share this post


Link to post
Share on other sites
Rob    547
Rob

Your English is fine.

 

If you put SteveS' code in Custom Code, then publish, you can see it live.  If you don't like it, just remove the code and publish without it.


Former PageLines Moderator, Food Expert and Raconteur

Share this post


Link to post
Share on other sites
rmaxsg    7
rmaxsg

Sorry for the misunderstand. 

 

i mean visitor come my site, won't see space  in between of 2 Column Horizontal. 

 

What is the code for it?

 

Here is the image

 

Thank you!

Share this post


Link to post
Share on other sites
rmaxsg    7
rmaxsg
Thank you so much for help in the forum Rob and SteveS. 
 
May i know how can i control LEFT and RIGHT of Margin and padding of Textbox or Mediabox.  By using CSS.
 
 
Thank you  & Sorry for the bad english 

Share this post


Link to post
Share on other sites
tsalstrand    8
tsalstrand

For the horizontal space between the rows, you should be able to put this,

margin-bottom: 10px; margin-top:0px;

in with the original 

body .pl-area .pl-section .pl-section > .pl-section-pad { padding: 0px;}

 to obtain this combined code: 

body .pl-area .pl-section .pl-section > .pl-section-pad { padding: 0px; margin-top: 0px; margin-bottom: 0px;}

Does that help you?  Don't for get just to refresh, but to also publish so that it'll be live for visitors to the site once you put it on a live domain.

If you still have problem, wait until you get it on the live host and send us a link so that we can trouble shoot it.

 

Best,

Stev

  • Like 1

Share this post


Link to post
Share on other sites
rmaxsg    7
rmaxsg

Sorry for the trouble. But it still no work as i expected. 

 

This is website link 

--i want media boxes to join together

 

This is what i want to achieve Image link

-- this is end result of media box joining together.

Share this post


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

Use this:
 

#plcolumnc644fd, #plcolumnc64520 {
margin-left: 0;
}

However, additional style may be required. If this is the case, I recommend you use Chromes web dev tools and inspect the elements you wish to customize.

Also, create an account on Code School, they provide a free course which introduces you to Chromes web dev tools, the course itself is quite awesome.

 

http://www.codeschool.com/courses/discover-devtools

  • Like 1

Please search our forums, before posting!

Share this post


Link to post
Share on other sites
rmaxsg    7
rmaxsg

Thank you so much Ninja is works.  it works.  Thank you for the effort SteveS and Smart egg.

:D

Share this post


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

Np, happy to help.


Please search our forums, before posting!

Share this post


Link to post
Share on other sites

  • Similar Content

    • JawDesigns
      By JawDesigns
      Hi to all,
      I always have this problem and I'm unhappy with the fix I usually apply for aligning columns at the bottom (see attached).
      For example: I use two text boxes side by side. Both text columns have a background colour. Text column 1 has 200 words and text column 2 has 300 words.
      How do I easily get them to align at the bottom without using a min-height declaration? I want to get text column 1 with 200 words to fit the height of text column 2 if that makes sense?
      Thanks for any help on this!
      Cheers,
      James

    • pehja
      By pehja+
      Hello!
      I am getting pretty tired of things that does not work as it should in DMS. Now it is impossible to have a two column footer with quickslider as one of the items. Take a look here http://pehjaproduction.se/kulingen/
      I have tried three column, two column, no column. nothing works. 
    • primetime
      By primetime+
      Hi,
      I am trying to change the right side column background color. I tried using Chrome's inspect element and was not able to find the right css to change. 
      Below is an example of a two-column page. I would like to change the right side background column color.
      http://travelblogfest.com/free-online-photography-courses-for-beginners/dslr-camera/what-is-aperture-priority/
      I'm trying to make the column look like this on the right side, http://www.pagelines.com/showcase/ Where the background is gray and shows leaderboard and trending sites.
    • canadvo
      By canadvo
      Hi there,
       
      This is a "phantom" problem we've had on our site since we upgraded to DMS2 eight or nine months ago.
       
      We have a large site and depend on the template system for almost all of our pages/posts. Typically it is a two column setup, with one containing the post loop/breadcrumbs, and the other column containing a widgetizer that displays the appropriate sidebar. Seemingly at random, the entire sidebar column will disappear from a template, leaving only the main column with post loop. We've never been able to isolate the problem or duplicate it. Sometimes, it happens to templates applied to pages that we haven't edited or even visited in quite some time. Sometimes, it will happen to templates we edited/published in the previous few days.
       
      I've never felt moved to post about this because the issue is impossible to predict, but it just now happened before my very eyes.
       
      I had just published a page that did not have a template applied. I wanted to apply the template we use on our "about us" pages, but I wasn't sure what it was called. I clicked on a page that had the template in question applied. All elements were present, the template was fine. Once I had the template name, I navigated back and loaded the correct template on the newly-edited page. When the page refreshed, the template had loaded without the sidebar column. I stopped and switched to Firefox (where I was logged out) and found that all pages within that template suddenly had no sidebar.
       
      I understand that this is an issue that is hard to provide support for, given that I've never been able to replicate it at will. Is this a problem others have had? Were there any plugins identified as a potential culprit? We have no cache plugins installed.
       
      Thanks!
    • seventhsite
      By seventhsite
      Website URL: http:/ben.webtechninja.com   (will change to: http://marketingwithaheart.com very soon)
      Framework Version:  DMS 2.1.4
      WordPress Version: 3.9.2
      Plugins in Use:  a whole lot, but nothing is broken so we are not worried about plugin conflicts here. 
      Server/Host: hostgator
      Details:
      Hi! I have custom css to add a white background to all columns. 
      I have just a few columns that I would like to change the color on, 
      however, when I add changes to the inline css, or try to make a 
      new class for that specific column, it is adding my custom CSS
      "behind" the white background.
       
      (I know this because it sticks 
      out of the bottom, under where border/shadow is set up on the 
      normal column css) 
       
      Is there any way to change that background color on just a few
      different columns, and keep the rest with my current custom 
      css? 
       
      Or, as an alternative, is there a way to create a second kind of 
      column all together? or some other way?
       
×