Hi Jim,

I've attached an image of what I see.

Notice how the moduletable is outside of the grid1, grid2 divs.

The moduletable div that sits outside of the grid1 module should either be within grid1 or grid 2. But it's outside of that div because there is an extra closing div somewhere in the grid1 modules.

The theme has a clear:both added to the moduletable so that's why it's forcing it down. So you could remove that by adding .moduletable {clear:none} to the custom.css. But the issue is related to something in the code from grid1.

Hope that clears it up for you.
Anthony

Thanks, Anthony. Two things:

1. After Paul alerted to me to a problem with the alt option of the "img" tag, I changed this:
<img src="images/stories/picture.png" alt="" style="float: left; margin: 0px 24px 20px 0px;" />

to this (removing the alt option):
<img src="images/stories/picture.png" style="float: left; margin: 0px 24px 20px 0px;" />

This fixed the problem, but I'm guessing it means we can't use the alt option for that image.


2. You say "the issue is related to something in the code from grid1." What we implemented that caused the issue is putting this CSS in custom.css:
.moduletable.mainFeat {border: 2px solid #165397; padding: .25em;}

where .mainFeat is the Module Class Suffix for the module.

I think you're saying that we should change that CSS to
.moduletable.mainFeat {border: 2px solid #165397; padding: .25em; clear: none;}

But it also sounds like the latter would not address what you consider to be the underlying grid1 problem.

What do you think?

Jim

Hi Jim,

When I looked at the alt tag - the alt tag wasn't opened or closed correctly so it read alt style=""

<img src="images/stories/picture.png" alt="" style="float: left; margin: 0px 24px 20px 0px;" />

I would really try and avoid using inline styling and use classes

<img src="/images/stories/dem-convention.png" class="floatleft" alt="text">

I can see the modules lining up now and if you see the same - then its just a case of adding an alt tag to the image

Cheers
Paul

I don't know what happened with that alt string, Paul. Maybe JCE was messing with me.

Speaking of which: When I opened the module, it seems that JCE had already added alt="" back to the img tag. And the front-end display works properly.

To use the class="floatleft" from your example, I presume I'd have to define the "floatleft" class in custom.css, correct?

Also, should I disregard what Anthony said about moduletable residing outside of grid1 and grid2?

Jim

Hi Jim,

The floatleft class already exists in the template css so adding that class and removing the inline styling should do the trick

Cheers

Correcting the html has done the trick as the divs are in the right place

Cheers
Paul

OK, that all totally works, Paul.

Thanks for running this one down.

Jim

Good luck with the site

Cheers

Paul