safari

[ToonMariner]

Hey peeps,

I have a problem with fieldsets and safari.

I have the following html...

[code]<div id="media">
<img src="/userfiles/images/contact.jpg" alt="image" width="380" height="320" longdesc="/longdesc.php?image_id=61" />
<span class="hidden"><a href="/longdesc.php?image_id=61">d</a></span>
</div>
<div id="text">
<form action="/index.php" method="post" enctype="application/x-www-form-urlencoded">
<fieldset>
<legend>Person</legend>
<label for="person">Person:</label>
<select name="mailto" id="mailto">
<option value="contact-us/person">Please Select...</option>
<option value="2">Rob Charlton</option>
<option value="6">Mike Douglas</option>
<option value="8">Richard Elphick</option>
<option value="3">Joe Gellert</option>
<option value="10">Andy Roberts</option>
</select><br />
<label for="name">Your Name:</label>
<input type="text" name="name" id="name" value="" /><br />
<label for="email">Email:</label>
<input type="text" name="email" id="email" value="" /><br />
<label for="subject">Subject:</label>
<input type="text" name="subject" id="subject" value="" /><br />
<label for="message">Message:</label>
<textarea name="message" id="message"></textarea><br />
</fieldset>
<input type="hidden" name="section" id="section" value="contact-us" />
<input type="hidden" name="mode" id="mode" value="person" />
<input type="submit" name="submit" id="submit" value="Send" />
</form>
<div class="clear"></div>
</div>[/code]

Now the div#media is floated right. BUT the fieldset in safari goes behind the image and is 100% the width of the div#text. I have tried setting a right margin on the fieldset to no avail. I know safari support for fieldsets is not too hot but this is driving me mad.

url if you need it.

[url=http://waringnetts.contrastcompany.co.uk/contact-us/person]http://waringnetts.contrastcompany.co.uk/contact-us/person[/url]

[michaellunsford]

It seems to me that your element is wider in safari than it is in firefox. The image to the right remains in the same spot on both. I'm not terribly proficient at CSS, but I'm thinking there's a width declaration missing?

Here's my comparison screen shot : safari is on top.
[img]http://www.virtual-showcase.net/phpfreaks/safari.gif[/img]

[ToonMariner]

nope the width of the parent container for the form is not explicitly defined simply given an auto margin for the right (this has to be so that content beyond the height of the image will fill the space under it.)

I know safari has issue with this but just wondered if anyone had managed to overcome them.