Layout problems

[TraceyHand]

You'd think I'd know by now.

I'm trying to edit the appearance of the attached.
I want the dropdown choices for the indicators to appear NEXT to the attribute heading and not below it but I can't for the life of me work out what is making it move down to the next line.

Where am I likely to be missing a line break or something? I know that's probably kinda like me asking you all where you think I put my carkeys or something.. just wondered if there was likely to be something easily missed.. its been driving me nuts!

[edit]
In the attachment, it's set up with the "add on" text as "html for name" for the component. I've tried using it in the "html for name" for the attribute instead but it just line breaks after the checkbox instead then

I've removed all the <br> tags that I can see but I can't seem to get the component, attribute AND choice all on one line. It's not a width problem (I've altered that now too) because there is plenty of space horizontally (well..moreso now I've altered it)

Also..the top dropdown...for colour.. I can get that on one line! The only reason it isn't is because I have a <br> tag in the html at the minute.

It seems reluctant to display on one line only when the component is optional with checkbox.
Not sure how relevant that is..but I suppose it must be because if I set the component to optional but "include NONE in the dropdown list"...it all shows on one line.

So, anyone know what, in the display of the checkbox, is forcing it onto 2 lines? Pretty please


Thanks

[completerookie]

1st thing to check for is <div>'s and <span>'s - they are probably being used for styling

by definition, a <div>content</div> will FORCE a new line BEFORE the "content" whereas a span will just put things "in-line" - you can always over-ride the rules by using style "bock" commmands but my guess is that that's not the issue here.

so if you need to force a new-line, use a DIV and if you want to "continue on the same line" use a span.
check out whether youv'e got a <div> and if so, replace it with a <span>

load the page into FireFox, and use the "web Developer" add-in, then click on the CSS menu, then choose "view style information"
you can now hover over the "problem areas" and anything you click-on will show you the style being used.
carefully move the mouse around the area and each "component" of the html will show up in the box immediately underneath the "web developer menu"
that will immediately give you some very good clues as to what's going on in the web page.

[TraceyHand]

thanks, Kevin..that's certainly useful to know.
Thing is.. the only <div> I can find anywhere is way up in the sectionname.

The weird thing is the whole thing is only split over 2 lines when the optional checkbox is visible.. if I set it as optional but give the "none" option in the dropdown instead..it all displays on one line

Trouble is, this looks untidy with a mix of checkboxes and no checkboxes.
I'll keep looking..it's gotta be here somewhere!

Thanks again
(ps..hadn't occurred to me to use the web developer thingie..I'd reverted back to previewing in IE for a short while)

[completerookie]

I think its time to create a test page area so we can see the two differing bits of code

clearly the checkbox is the problem, - have you looked at the layout defintion of the checkbox, could it be its in a table. and thats whats throwing it?

alternative, cheat and display a checkbox that is disabled (greyed out), then it might not look so "messy"

[TraceyHand]

yeh..I'm going to upload the test site soon (waiting to get back to the office which has an upload time 6 times faster than home!)

I'll show you what I mean then.
Cheers

[kathynewman]

Update?

Tracey

Did you manage to work this one out - just come across same problem myself - could get it to work in V7 but was bit complicated - thought I'd ask before trying to reinvent the wheel as it where!

Kathy

[TraceyHand]

not really Kathy, no
If I use a checkbox..it forces the rest of the component/attribute/choice onto another line. Nothing I did fixed it.
The only way round it that I found was to eliminate the checkbox by using "none" as an option in the dropdown.
The top 2 products HERE are an example.
I wanted the indicator add-ons to have a check box like the other add-ons but, when I do..it pushes the rest onto a line below (like in my original attachment)
I worked round it but I'd still prefer the checkbox!

[TraceyHand]

update on the problem

I might take the up with support actually but here it is, in pictures!

The attachment "checkbox" shows how it displays when I have the checkbox showing (instead of listing "none" in the dropdown as it is on site)

Nothing in my layout is forcing this linebreak and it's not a width issue either. (i've tried it with 1 word descriptive text to make sure)

Does anyone have any idea why the inclusion of the checkbox is breaking it up like this?
I did notice, when I first posted about this, that I wasn't the only one with this problem but no solution was found in previous posts.

I just want checkbox, component, attribute and choice dropdown all on one line...is that too much to ask?