The information in this thread might be outdated
If the solution did not help, please, check our Help Portal or contact Ecwid Team.
 
 
Thread Tools Display Modes
  #1  
Old 06-29-2010, 06:34 PM
Preston Herrick's Avatar
Preston Herrick is offline
Junior Member
 
Join Date: Jun 2010
Posts: 22
Default

Changing width of select option box


How can I change the width of the dropdown option box (or perhaps the font size displayed within)? I have a product where the customer needs to select the year, make, and model of vehicle from a list - however the box isn't quite wide enough to display all the text. Attached is an example.
Attached Images
File Type: jpg optionbox.jpg (47.2 KB, 319 views)
  #2  
Old 06-29-2010, 07:45 PM
Qetzal's Avatar
Qetzal Qetzal is offline
Ecwid Team
 
Join Date: Sep 2009
Posts: 10,847
Default

Quote:
Originally Posted by Preston Herrick View Post
How can I change the width of the dropdown option box (or perhaps the font size displayed within)? I have a product where the customer needs to select the year, make, and model of vehicle from a list - however the box isn't quite wide enough to display all the text. Attached is an example.
Can you post a link to this product?
__________________
Eugene K.
Ecwid Team

@ecwid | Facebook | Ecwid Knowledge Base
  #3  
Old 06-29-2010, 08:05 PM
Preston Herrick's Avatar
Preston Herrick Preston Herrick is offline
Junior Member
 
Join Date: Jun 2010
Posts: 22
Default

Here's a temporary link. Experimenting at this point:

http://app.ecwid.com/jsp/142215/simp...roduct=1000579
  #4  
Old 06-29-2010, 08:10 PM
Preston Herrick's Avatar
Preston Herrick Preston Herrick is offline
Junior Member
 
Join Date: Jun 2010
Posts: 22
Default

I just tried it in Firefox and it displays correctly (textbox expands horizonatally). It's IE 8 that truncates it to a fixed width.
  #5  
Old 06-29-2010, 08:12 PM
Qetzal's Avatar
Qetzal Qetzal is offline
Ecwid Team
 
Join Date: Sep 2009
Posts: 10,847
Default

Quote:
Originally Posted by Preston Herrick View Post
Here's a temporary link. Experimenting at this point:

http://app.ecwid.com/jsp/142215/simp...roduct=1000579
Thank you.

In order to change the width of the right box, apply this CSS code:

HTML Code:
div.ecwid-productBrowser-details-rightPanel div.ecwid-productBrowser-backgroundedPanel {
  max-width:350px;
}
In order to change the font size, apply this code:

HTML Code:
select.ecwid-productBrowser-details-optionSelectBox  {
  font-size:10px;
}
__________________
Eugene K.
Ecwid Team

@ecwid | Facebook | Ecwid Knowledge Base
  #6  
Old 06-29-2010, 08:30 PM
Preston Herrick's Avatar
Preston Herrick Preston Herrick is offline
Junior Member
 
Join Date: Jun 2010
Posts: 22
Default

Cool, thanks!
  #7  
Old 07-17-2010, 02:12 AM
Preston Herrick's Avatar
Preston Herrick Preston Herrick is offline
Junior Member
 
Join Date: Jun 2010
Posts: 22
Default

Still having issues with this in IE8.

I've tried values other than 350px with no improvement. As soon as you add the item to the cart though the product details background does get wider and the option dropdown stretches.

http://www.spyderindustries.com/test...roduct=1006608
  #8  
Old 07-18-2010, 12:48 PM
Qetzal's Avatar
Qetzal Qetzal is offline
Ecwid Team
 
Join Date: Sep 2009
Posts: 10,847
Default

Quote:
Originally Posted by Preston Herrick View Post
Still having issues with this in IE8.

I've tried values other than 350px with no improvement. As soon as you add the item to the cart though the product details background does get wider and the option dropdown stretches.

http://www.spyderindustries.com/test...roduct=1006608

When you apply the CSS code, do you see any changes?
__________________
Eugene K.
Ecwid Team

@ecwid | Facebook | Ecwid Knowledge Base
  #9  
Old 07-19-2010, 02:10 AM
Preston Herrick's Avatar
Preston Herrick Preston Herrick is offline
Junior Member
 
Join Date: Jun 2010
Posts: 22
Default

That's what I'm saying. I applied the code below and even tried other values (375px, 400px, etc) and there is no change.

div.ecwid-productBrowser-details-rightPanel div.ecwid-productBrowser-backgroundedPanel {
max-width:350px;
}
Attached Images
File Type: jpg shot.jpg (96.7 KB, 185 views)

Last edited by Preston Herrick; 07-19-2010 at 02:15 AM.
  #10  
Old 07-19-2010, 01:00 PM
Qetzal's Avatar
Qetzal Qetzal is offline
Ecwid Team
 
Join Date: Sep 2009
Posts: 10,847
Default

Quote:
Originally Posted by Preston Herrick View Post
That's what I'm saying. I applied the code below and even tried other values (375px, 400px, etc) and there is no change.

div.ecwid-productBrowser-details-rightPanel div.ecwid-productBrowser-backgroundedPanel {
max-width:350px;
}
Hm, try to apply this code:

HTML Code:
div.ecwid-productBrowser-details-rightPanel div.ecwid-productBrowser-backgroundedPanel {
  width:350px !important;
}
Does it change anything?
__________________
Eugene K.
Ecwid Team

@ecwid | Facebook | Ecwid Knowledge Base
 
The information in this thread might be outdated
If the solution did not help, please, check our Help Portal or contact Ecwid Team.

Thread Tools
Display Modes

Posting Rules
You may not post new threads
You may not post replies
You may not post attachments
You may not edit your posts

BB code is On
Smilies are On
[IMG] code is On
HTML code is Off

Forum Jump


All times are GMT. The time now is 01:40 AM.
Powered by vBulletin® Version 3.8.11. Copyright ©2000 - 2021, Jelsoft Enterprises Ltd.