Re: [WSG] Select Padding in IE

2009-11-18 Thread Nick Cowie 
>
> Can anyone tell me how to fix this?
>
> Don't use padding  ;-)

You need to put a wrapper div around it and play with conditional comments.

IE has "fixed" some values for form elements and you can not change them, I
know that IE6  had "fixed" values for padding and some others for attributes
of the button element.  (this was while investigating a solution to "fixed"
values in Safari on OsX for input type submit)


***
List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm
Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm
Help: memberh...@webstandardsgroup.org
***

Re: [WSG] Select Padding in IE

2009-11-18 Thread Nathanael Boehm 
If you want to style selects best bet is to use one of the customised select
jQuery plugins available.

In my experience they're a bit nasty and can cause all sorts of problems not
least of all performance because they replace the select with a bunch of
divs and spans or lists and then have to simulate all the behaviour of a
native select ... but if you *need* to have it styled to that extent then I
suggest you look into them.

Cheers,

Nathanael Boehm

Freelance web user interaction designer

UX · IxD · UI design · Prototyping · HTML · CSS · JS · Usability ·
Accessibility · Social media · Tech training

Imagine Innovation · KATA Professional · UXnet Canberra · OpenAustralia ·
BarCampCanberra

Australian Social Innovation eXchange (ASIX) Canberra

www.purecaffeine.com 

Canberra, Australia

0409 288 464

Latest blog post: Social experience design in online
conversation

RSVP  for Canberra Freelancers and Entrepreneurs
Coffee, 23 November
RSVP  for Canberra ASIX solution design and
architecture evening, 25 November
RSVP  for BarCampCanberra 2010, in mid-February


On Thu, Nov 19, 2009 at 11:30 AM, Daniel Anderson wrote:

> G'day
>
> I am having problems with applying padding to a SELECT element.
>
> It works fine in Firefox but the padding does not get applied in IE?
>
> Can anyone tell me how to fix this?
>
> Cheers
>
> Daniel
>
> ***
> List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm
> Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm
> Help: memberh...@webstandardsgroup.org
> ***


***
List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm
Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm
Help: memberh...@webstandardsgroup.org
***

[WSG] Select Padding in IE

2009-11-18 Thread Daniel Anderson 
G'day

I am having problems with applying padding to a SELECT element.

It works fine in Firefox but the padding does not get applied in IE?

Can anyone tell me how to fix this?

Cheers

Daniel


***
List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm
Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm
Help: memberh...@webstandardsgroup.org
***

Re: [WSG] I.E Navigation help

2009-11-18 Thread Enquiry @ Wombat Media 

I've obviously missed a vital part of the code and that is the
"navlist li" part.

Thanks all guys.

Sent from my iPhone

On 19/11/2009, at 11:18 AM, "Stuart Foulstone"  
 wrote:




What you're trying to do is alter the display of the native list  
structure

- not the links.

That is you want to display the list-items inline and floated left. (

e.g.

.navlist li  {
   display: inline;
 float: left;
   list-style-type: none;
}



On Wed, November 18, 2009 10:24 am, Jerome Carpen wrote:

hey guys,



Have got the following navigation to work in firefox, safari, chrome,
opera and the such, but not IE.

In IE, the links do not go inline but scale left to right in a step
manner.



Any ideas of what i'm missing?



==HTML





   Link1

   Link2

   Link3

   Link4







==CSS



#nav {

   background-color: #930;

   float: left;

   width: 600px;

}

.navlist {

   list-style-type: none;

}

.navlist li a {

   font-family: Georgia, "Times New Roman", Times, serif;

   font-size: 24px;

   color: #FFF;

   text-decoration: none;

   display: block;

   float: left;

   padding-right: 20px;

   padding-left: 20px;

}

.navlist li a:hover {

   color: #0F3;

}









***
List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm
Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm
Help: memberh...@webstandardsgroup.org
***







***
List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm
Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm
Help: memberh...@webstandardsgroup.org
***




***
List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm
Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm
Help: memberh...@webstandardsgroup.org
***

Re: [WSG] I.E Navigation help

2009-11-18 Thread Stuart Foulstone 

What you're trying to do is alter the display of the native list structure
- not the links.

That is you want to display the list-items inline and floated left. (

e.g.

.navlist li  {
display: inline;
float: left;
list-style-type: none;
 }



On Wed, November 18, 2009 10:24 am, Jerome Carpen wrote:
> hey guys,
>
>
>
> Have got the following navigation to work in firefox, safari, chrome,
> opera and the such, but not IE.
>
> In IE, the links do not go inline but scale left to right in a step
> manner.
>
>
>
> Any ideas of what i'm missing?
>
>
>
> ==HTML
>
>
>
> 
>
> Link1
>
> Link2
>
> Link3
>
> Link4
>
> 
>
>
>
>
>
> ==CSS
>
>
>
> #nav {
>
>   background-color: #930;
>
>   float: left;
>
>   width: 600px;
>
> }
>
> .navlist {
>
>   list-style-type: none;
>
> }
>
> .navlist li a {
>
>   font-family: Georgia, "Times New Roman", Times, serif;
>
>   font-size: 24px;
>
>   color: #FFF;
>
>   text-decoration: none;
>
>   display: block;
>
>   float: left;
>
>   padding-right: 20px;
>
>   padding-left: 20px;
>
> }
>
> .navlist li a:hover {
>
>   color: #0F3;
>
> }
>
>
>
>
>
>
>
>
>
> ***
> List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm
> Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm
> Help: memberh...@webstandardsgroup.org
> ***
>
>




***
List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm
Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm
Help: memberh...@webstandardsgroup.org
***

Re: [WSG] I.E Navigation help

2009-11-18 Thread Lesley Lutomski 

Hi Jerome,

I had the same problem some time ago - so long ago, I'm no longer sure 
exactly what actually fixed it.  However, I think the answer, or part of 
it, involves setting display:inline on the , not the  and then 
setting your padding, etc. on the .  I also found I had to set a line 
height for my .  Using a font size of 1.2em, a line height of 1.6em 
seemed to do the trick, although why I have no idea!


Hope this helps.

Lesley

Jerome Carpen wrote:
hey guys, 




Have got the following navigation to work in firefox, safari, chrome, opera and the such, but not IE. 


In IE, the links do not go inline but scale left to right in a step manner.



Any ideas of what i'm missing?  




==HTML





Link1

Link2

Link3

Link4







==CSS



#nav {

background-color: #930;

float: left;

width: 600px;

}

.navlist {

list-style-type: none;

}

.navlist li a {

font-family: Georgia, "Times New Roman", Times, serif;

font-size: 24px;

color: #FFF;

text-decoration: none;

display: block;

float: left;

padding-right: 20px;

padding-left: 20px;

}

.navlist li a:hover {

color: #0F3;

}









***
List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm
Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm
Help: memberh...@webstandardsgroup.org
***





***
List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm
Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm
Help: memberh...@webstandardsgroup.org
***

RE: [WSG] I.E Navigation help

2009-11-18 Thread Foskett, Mike 
Sounds to me like you’ve added display:inline to the li but left out float:left.

Mike

From: li...@webstandardsgroup.org [mailto:li...@webstandardsgroup.org] On 
Behalf Of dwain
Sent: 18 November 2009 10:52
To: wsg@webstandardsgroup.org
Subject: Re: [WSG] I.E Navigation help


On Wed, Nov 18, 2009 at 4:24 AM, Jerome Carpen 
mailto:enqu...@wombatmedia.com.au>> wrote:

hey guys,



Have got the following navigation to work in firefox, safari, chrome, opera and 
the such, but not IE.

In IE, the links do not go inline but scale left to right in a step manner.



Any ideas of what i'm missing?



==HTML

try this.



   Link1Link2Link3Link4




cheers,
dwain


--
"Fear of the devil is one way of doubting God.  " - Kahlil Gibran

***
List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm
Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm
Help: memberh...@webstandardsgroup.org
***




This is a confidential email. Tesco may monitor and record all emails. The 
views expressed in this email are those of the sender and not Tesco.

Tesco Stores Limited
Company Number: 519500
Registered in England
Registered Office: Tesco House, Delamare Road, Cheshunt, Hertfordshire EN8 9SL
VAT Registration Number: GB 220 4302 31

***
List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm
Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm
Help: memberh...@webstandardsgroup.org
***

Re: [WSG] I.E Navigation help

2009-11-18 Thread dwain 
On Wed, Nov 18, 2009 at 4:24 AM, Jerome Carpen
wrote:

> hey guys,
>
>
>
> Have got the following navigation to work in firefox, safari, chrome, opera
> and the such, but not IE.
>
> In IE, the links do not go inline but scale left to right in a step manner.
>
>
>
> Any ideas of what i'm missing?
>
>
>
> ==HTML
>
> try this.
>
> 
>
>Link1 >Link2 >Link3 >Link4
>
> 
>
>
cheers,
dwain


-- 
"Fear of the devil is one way of doubting God.  " - Kahlil Gibran


***
List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm
Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm
Help: memberh...@webstandardsgroup.org
***

[WSG] I.E Navigation help

2009-11-18 Thread Jerome Carpen 
hey guys, 



Have got the following navigation to work in firefox, safari, chrome, opera and 
the such, but not IE. 

In IE, the links do not go inline but scale left to right in a step manner.



Any ideas of what i'm missing?  



==HTML





Link1

Link2

Link3

Link4







==CSS



#nav {

background-color: #930;

float: left;

width: 600px;

}

.navlist {

list-style-type: none;

}

.navlist li a {

font-family: Georgia, "Times New Roman", Times, serif;

font-size: 24px;

color: #FFF;

text-decoration: none;

display: block;

float: left;

padding-right: 20px;

padding-left: 20px;

}

.navlist li a:hover {

color: #0F3;

}









***
List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm
Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm
Help: memberh...@webstandardsgroup.org
***