Forums / Templates, Stylesheets, Page Layout / How to have text next to image in main page?

How to have text next to image in main page?

Views: 1,192

Results 1 to 7 of 7
11 Jun 2011, 10:02 PM
#1
johnybravo avatar

johnybravo

Zen Follower

Join Date:
Jun 2011
Posts:
107
Plugin Contributions:
0

How to have text next to image in main page?

Hi,
If you look at my main page curvesandcorsets.com/catalog you will see that I have a large image and below it I have a paragraph that starts "We offer a beautiful collection of traditional and ...."
Is there a way to have the paragraph next to the image? ie I want the wording to be on the left hand side and the image on the right instead of a single column.

Thanks,

John

12 Jun 2011, 7:43 PM
#2
schoolboy avatar

schoolboy

Totally Zenned

Join Date:
Jun 2005
Location:
Cumbria, UK
Posts:
10,327
Plugin Contributions:
0

Re: How to have text next to image in main page?

That is a HTML and CSS issue. This forum unfortunately does not teach the basics of HTML and CSS. To style any of the DEFINED pages (or an EZPage), you need to know how to compose appropriate HTML and/or CSS.

There are literally hundreds of tutorials on the WWW - (another reason why we don't duplicate it here) - and you can stop off a w3schools.com as a starting place.

BTW... re-think your layout at 100% of screen size... it looks awful on a wide screen monitor. Ideally, set your width to about 980 pixels. That caters for most monitors.

20 years a Zencart User

12 Jun 2011, 9:07 PM
#3
lissae avatar

lissae

Totally Zenned

Join Date:
Oct 2007
Location:
Australia
Posts:
814
Plugin Contributions:
0

Re: How to have text next to image in main page?

Add align="right" into the image code, like so:

<img title="Standard and made to measure corsets in stunning fabrics!" alt="Beautiful traditional corsets from Curves and Corsets" src="http://www.curvesandcorsets.com/images/elegancerose.jpg" align="right">I'd also counsel you to rethink your color scheme, the bright pink and purple hurts my eyes and you'd do better to go with the blues in your logo image, just my humble opinion :)

HunnyBee Design
"A man's manners are a mirror in which he shows his portrait." ~ Johann Wolfgang von Goethe

12 Jun 2011, 9:19 PM
#4
schoolboy avatar

schoolboy

Totally Zenned

Join Date:
Jun 2005
Location:
Cumbria, UK
Posts:
10,327
Plugin Contributions:
0

Re: How to have text next to image in main page?

LissaE:

bright pink and purple ...

I tend to agree... these "brash" colours are more akin to "adult" sites of a more dubious nature. While your products are in an "adult" bracket, they could be made to look very sophisticated and mildly erotic without any air of "common-ness".

See one of our DEMO STORES for lingerie.

20 years a Zencart User

13 Jun 2011, 9:27 AM
#5
johnybravo avatar

johnybravo

Zen Follower

Join Date:
Jun 2011
Posts:
107
Plugin Contributions:
0

Re: How to have text next to image in main page?

Thanks for you input guys. Would an HTML table work? I used the colours from Colourschemedesigner.com I think I will try the lighter version

13 Jun 2011, 10:21 AM
#6
schoolboy avatar

schoolboy

Totally Zenned

Join Date:
Jun 2005
Location:
Cumbria, UK
Posts:
10,327
Plugin Contributions:
0

Re: How to have text next to image in main page?

Strictly speaking, HTML tables are "deprecated" in HTML4 onwards (discontinued) - but tables are still used extensively - even in native zencart, and most other platforms.

So yes... you can use tables to position elements more accurately, but properly formatted DIVS with appropriate CSS declarations are preferable.

You can create your HTML in an external editor, making sure that:-

  1. You do not use your external editor to apply CSS ID and Class Tags to the elements. You need to create these tag definitions yourself, making sure you do not name them any name that currently exists in the ZC stylesheet(s).

  2. When you bring in your HTML code from the external editor, you clip only what exists between the opening <body> and closing </body> tags. Do not import header or footer info. If it is just the <table> you want, then clip only that part of yiour HTML and paste it into your define page, (or (EZPage), making sure to first toggle to "source code" mode in the ZC editor (HTMLArea or CK Editor or whatever), so that you paste the HTML.

20 years a Zencart User

14 Jun 2011, 6:15 AM
#7
johnybravo avatar

johnybravo

Zen Follower

Join Date:
Jun 2011
Posts:
107
Plugin Contributions:
0

Re: How to have text next to image in main page?

Thanks again for your honest opinions and help. The align right worked perfectly without having to create lots more code.