Fixed Size Text on Stretchy Homepage

indrajitsen

My homepage (www.indrajitsen.com) layout is Stretchy. I have a slideshow on home page, so that works nicely. But I am trying to add a text box below the slideshow, and I would like the text box to have a fixed size (may be 1200px) and be centered on page so that in large desktop screens it looks nicer. In iPad / tablet it'll all be taking full screen, so that is fine. I could not make the text box fixed size and center aligned. Is there a simple solution for this? I also plan to add some video or other content below the slideshow, so need to understand how I can align various items there. Appreciate any help!

tomnovy

Hi There,

Because you are using a stretchy layout - your content will automatically adjust to the size of the browser that your visitors are using.

But you can add a CSS content block to your page and paste this code to it:

.sm-widget-text{ max-width: 600px;
text-align: center;
margin-left: auto;
margin-right: auto;
}

This will place your text in the middle + it will make your text block up to 600px wide.

indrajitsen

Thanks, that worked. Is there a list of components reference like .sm-widget-text that I should use when I try to control various components?

tomnovy

Hi there,

Yes, each object has its own ID - so you will need to address it separately. You can find those IDs by using Firefox WebDeveloper extension - you can read about this here:

http://dgrin.smugmug.com/gallery/1354921

indrajitsen

Thanks a lot, I'll try that out.