Ok, this is a strange one to me...generally, or rather, never have I run into something that worked on FF, and IE(6/7), that didn't work on Safari or Opera...so...
basicly it's like this, I want everything in this div to appear straight across. The way the div gets built comes from Drupal and one of it's modules, and if need be, I "probably" could rewrite the code that spits out the form...but I still want to beleive I can get what I want with css..or have almost gotten...
I've been at this all day just about, so while maybe not my last resort, but once I get this relatively lined up...then I can go to work on making the form "real pretty"...
thanks

9 Comments
Oli
Written Feb. 29, 2008 / Report /
How do you mean straight across?
You mean:
<Title> <Input> <Button> <Link>all in one line?trevorlee_nc
Written Feb. 29, 2008 / Report /
yup...just like it appears now in firefox or ie
Oli
Written Feb. 29, 2008 / Report /
At a glance, Safari appears to render the text-box a lot wider.
Try setting a width on the input =)
Mike
Written Feb. 29, 2008 / Report /
Yup, width on the input and make sure your normally block-level elements are set to
display: inline;.trevorlee_nc
Written Feb. 29, 2008 / Report /
I'm unfortunately lacking in proper terminology...so please bear with me :)
input as in my submit button ?
block level elements as in my input,text/input,submit/anchor ?
Oli
Written Mar. 1, 2008 / Report /
Try just adding these lines to your CSS:
#faceted-search-ui-form .form-text {width:170px}#faceted-search-ui-form .form-submit {width:60px}You might need to play with the values, but they should get you going in the right direction.
I'm not sure what needs the
display:inlineso perhaps Mike can fill you in there.trevorlee_nc
Written Mar. 1, 2008 / Report /
tried adding just that, as well as tried getting rid of some of the "extra" css, and had those two elements like this:
#faceted-search-ui-form .form-text { /* text box */background-color: #FFF;
border 1px solid #000;
width:170px;
}
#faceted-search-ui-form .form-submit { /* submit button */
margin-top:2px;
height:20px;
background-color: #FFF;
border: 1px solid #000;
width:60px;
}
plus I've tried who knows how many float: and display: combinations...I think I've even repeated on or two...
trevorlee_nc
Written Mar. 1, 2008 / Report /
it's AMAZING what a halfway good night's sleep will do...plus some help in the right direction of the use of block:
so I GOT it...and I think I got it right...at least on three browsers...FF/IE/Opera, Safari is still showing it messed up...but also safari acts funky on XP sometimes so...
here is the link with the form in place...had to make some more css adjustments to counter stuff that drupal does, as well as some of the theme css...
Form In Use
Now, and I was able to get the next part somewhat handled, but still running into another issue, and I feel I've got my css right...or mostly...
The drupal module adds two radio buttons to the form when you "move into" your search, IE/FF no problem, a little block/float here and there...and all was right with the world...but, back to the opera problem...nope nadda
so here is the cut version of the form with the radio buttons
[new form]
again, a huge thanks to you two...
*I'll be over here pulling my hair out and trying more combinations of what might/might not work in the meantime*
-trev
trevorlee_nc
Written Mar. 1, 2008 / Report /
*UPDATE*
Well, I've known from the start, that if "I could rewrite" the form, I'd be able to do what I needed to do...well, turns out using phptemplate in Drupal...I can...
so...yet something else to learn...lets see how this goes once I figure out how to rebuild all the variables and whatever else would go in there into the custom template just for that form!
-t