Jump to content


Photo
- - - - -

How can I get this type of text alignment?

css sections pagelines headers

Best Answer James B , 03 October 2013 - 11:50 PM

Hi there,

 

In the banner section you can either arrange the text to the left/right and the image to the opposite ect. Unfortunately the banner meta won't allow the title of the section to be offset against the main text etc. You could make adjustments to the main text using css to give the impression it's indented by adjusting the margin on one side.

Go to the full post


  • Please log in to reply
7 replies to this topic

#1 hrachovec

hrachovec

    Newbie

  • Members
  • 8 posts
  • Country: Country Flag

Posted 27 September 2013 - 06:46 PM

Hello:

 

I'm wondering if I can achieve the attached kind of layout with an existing Pagelines section? I want the headline on the left almost in its own column and the smaller text on the right. I guess I can use 2 boxes, but seems messy. I thought maybe to apply some sort of bootstrap formatting, but not sure if an existing type of section can do this instead?

 

Any answers welcome. 

 

Cheers, Russell

Attached Files



#2 greenfly

greenfly

    Advocate

  • Members

  • 3268 posts
  • LocationManchester, England
  • Framework Version:latest
  • Country: Country Flag

Posted 27 September 2013 - 07:49 PM

Hello hrachovec 

 

You could achieve this very easily and responsively using the PageLines grid, a completely responsive grid system that contains 12 columns, or “spans.”

 

The guide is here 

Please Login or Register to see this Hidden Content


  • batman likes this

#3 hrachovec

hrachovec

    Newbie

  • Members
  • 8 posts
  • Country: Country Flag

Posted 03 October 2013 - 04:09 PM

Hi Martin:

 

OK, thanks. As a developer I get how to do the Pagelines grid, but that seems to involve hard coding. I'm comfortable with that, but I think my clients might find that tricky. I'll work around the layout issue. 

 

Thanks for the reply. 

 

Kind regards, Russell



#4 Jake

Jake

    Advocate

  • Premium
  • 565 posts
  • LocationNC, USA
  • Country: Country Flag

Posted 03 October 2013 - 04:34 PM

Hi @

Please Login or Register to see this Hidden Content

- Perhaps your clients would be more comfortable with a Banner then? I believe it will give you the look you've requested. See

Please Login or Register to see this Hidden Content

for more information.



#5 hrachovec

hrachovec

    Newbie

  • Members
  • 8 posts
  • Country: Country Flag

Posted 03 October 2013 - 05:02 PM

Hey Jake:

 

Thanks. I've put 2 banners in for these pieces of content. I can manually get the headline in a left column and then float the text in a right column, but I think this might break when the browser is smaller or in mobile view. I noticed in the settings for each Banner, there's an option to 'Configure the padding and arrangement of banner text', but it's not clear how to configure this. Can I arrange a headline to the left and body text to the right?

 

Cheers, R



#6 James B

James B

    Advocate

  • Moderators
  • 5126 posts
  • LocationSurrey - UK
  • Country: Country Flag

Posted 03 October 2013 - 11:50 PM   Best Answer

Hi there,

 

In the banner section you can either arrange the text to the left/right and the image to the opposite ect. Unfortunately the banner meta won't allow the title of the section to be offset against the main text etc. You could make adjustments to the main text using css to give the impression it's indented by adjusting the margin on one side.



#7 hrachovec

hrachovec

    Newbie

  • Members
  • 8 posts
  • Country: Country Flag

Posted 04 October 2013 - 07:40 PM

Hi James:

 

OK, thanks for that. 

 

Cheers, R



#8 Rob

Rob

    One Smart Egg

  • Members
  • 13575 posts
  • LocationEast Coast, USA
  • Framework Version:The Latest, of course
  • Country: Country Flag

Posted 04 October 2013 - 09:40 PM

I'll pass your thanks along to James!

 

Thanks for letting us know!







Also tagged with one or more of these keywords: css, sections, pagelines, headers