Jump to content

Archived

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

tajogesi

customizing columns

Recommended Posts

tajogesi    0
tajogesi

Hi, 

 

Because of the twitter that doesn't work in the morefoot area i had to put the designlayout in columns, but now it is hard to have the right space between the blocks on my homepage. The homepage is varies in different browser. On my Ipad on safari some stick the the block above, while in the Ipad chrome browser the look like I want them to look. Before with my boxes on the homepage the negative margins looks much better than now with the columns.

 

Any idea how to solve this or have better margins between the columns.

 

Kind regards

Share this post


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

Hi,

 

Can you provide a link to your site please.


Please search our forums, before posting!

Share this post


Link to post
Share on other sites
tajogesi    0
tajogesi

Hi Danny,

 

I thought you could see it on my member information, but herewith www.baeno.nl it also doesn't load so pretty anymore like with the boxes, but that is a small issue.

 

Kind regards

Share this post


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

Yeah I could see that, but sometimes users are referring to a completely different website.

 

Basically, your issue is related to your custom CSS and class(es) you have added to your Grid HTML. Please be aware we are unable to provide support to user created code.

 

If you want to customize the grid and keep it in proportion, you would probably want to remove the homebox div, as I am not entirely sure what that is doing and add a custom div after each span4 div or add a custom class to that the span4 div.

For example.

 

<div class="row">
<div class="span4 custom-class">
...
</div>
<div class="span4 custom-class">
...
</div>
<div class="span4 custom-class">
...
</div>
</div>

Please search our forums, before posting!

Share this post


Link to post
Share on other sites
tajogesi    0
tajogesi

Hi Danny,

 

I created the homebox div to have the exact margins of the morefooter widgets, this is the .homebox {margin-left: -15pxpadding-top: 15pxwidth: 108%;}.

 

In my topic I do mean the bottom margins of the first colomn "Wat doet BA&O" relative to the "Agenda" widget and the second colomn "Nieuws" relative to the "Aanmelden nieuwsbrief". Now I do this with negative margins, just like i did it before with boxes on the homepage.

 

With the boxes the negative margings always works fine and I could create the exact margin I wanted to have between the boxes, with the columns now it varies. 

 

Kind regards

Share this post


Link to post
Share on other sites
Rob    547
Rob

Probably because the columns are responsive, and boxes were fixed percentages.  If you added custom code for boxes to set padding/margins, etc, I'm sure it worked, but with responsive design, your content will wrap according to the way its length, and will keep the visible content looking like the padding/margins are wide one place, narrow in another. 


Former PageLines Moderator, Food Expert and Raconteur

Share this post


Link to post
Share on other sites

  • Similar Content

    • dbrowne02
      By dbrowne02+
      Hi, I am trying to figure out how to create columns where the text flows into the next column, like the attached, and am flummoxed. Does anyone have any ideas? 

    • tkpagelines
      By tkpagelines+
      Hi there,
      how to make the corners of boxed columns round ?
      Any suggestions ?
      Thanks
    • 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

    • jeomiland
      By jeomiland+
      For quite a while I have worked around a refresh issue but it seems quite convoluted and near impossible to explain to clients. According to a lesson in PagelinesAcademy, it is because of javascript but there must be a more elegant way to deal with this. Here are 2 scenarios:
      1) Custom CSS: I add a css style to custom css, then have to select Edit in a component, then click in 2 text boxes to get the Refresh icon in the tools pallet to show. I click Publish a couple times then Refresh and hope that the new CSS code is still there - half the time it is not, so I have to redo a couple times till the system keeps it. Your "Tip: Hit [Cmd⌘+Return] or [Ctrl+Return] to Preview Live" at top of CSS window does nothing on my Macbook Pro.
      2) Home page at: http://199.119.180.102/~harmhill/newsite/ has 2 columns for main template area. In larger right column, I need to add a 3 column above the WPloop and below the image, which are both in that right column. I can drag the 3col section to the right place and it says "Section Added! Refresh page to view." Have tried several ways to get the section to stay and refresh but nothing works! Using cmd-r (refresh) in Mac Chrome, not my trick above... can't get the 3col section to stay on refresh, so no way to add the 3 text boxes required next.
      So 2 questions:  1) what is best way to refresh a page and preserve CSS and sections added and 2) can you put a 3-col inside 1col of a 2-col?
      thanks
    • nandorj78
      By nandorj78+
      Hi, I'd like to know if there is way to put the Hero box right under the column above it. The way it is now (see attached picture) has a lot of blank space. I can't seem to move it up a bit fo fill in this empty space.
×