Drop Down Text Alignment question

[Pamb10]

I have a topic that will have several drop down text sections as shown in the attached image.

Alignment.png

What I want to do is to better align the closed/opened icons for each entry as shown by the red vertical line.

Any way to do this?

My second question relating to this example involves aligning my images to the left of each drop down section.

AlignIcons.png

The (Icon + Drop Down Head) currently look like the examples, My Medicatons and My Allergies.
I want it to look like the example of My Health Conditions, where the icon is centered vertically with the text. Is this possible?

Thanks in advance.
Pam

[Pamb10]

Still looking for advice on this issue. Anyone have any ideas?

[SteveS]

How are you achieving your current look?

I'm guessing you have an inline image, with text within the same paragraph tags?

The old school approach would be to use a table, with hidden borders.

HTH (and starts the ball rolling with the new-fangled methods...)

[ecjoe]

Pamb10,

I use the background-position property to manually adjust the horizontal and vertical positions of background images.

Generic Example:

Code: Select all

background-position: 13px 7px;

Drop-Down Text Example:

Code: Select all

MadCap|dropDownHotspot
{	
	background-position: 5px 5px;
}

For more information, please refer to the xpos ypos section in:
http://www.w3schools.com/cssref/pr_back ... sition.asp

[Pamb10]

Hi guys,

I appreciate the feedback. I am using an inline image. Is there a better way to do this?

In the meantime I will play around with the background-position.

Thanks
Pam

[ecjoe]

Pamb10,

FYI, the background-position property is only meant to be used with background images. As far as usage goes, background images are usually used for decorations as opposed to content. If you need to include an image when printing, then you probably want to use an inline image.