Need help making row of buttons consistent

Posted by oliverghingold on Stack Overflow See other posts from Stack Overflow or by oliverghingold
Published on 2010-03-27T16:13:22Z Indexed on 2010/03/27 22:43 UTC
Read the original article Hit count: 340

Filed under:

button

|

rollover

|

help

|

mobileweb

|

web-development

I'm making my first website, and I'm trying to make variable-sized buttons so they'll render correctly on low resolution (read: mobile) browsers. Currently I just have the usual rollover image solution (185 pixels wide by 37 tall if anybody cares), but when I preview the site in low resolution it looks, predictably enough, like complete crap (more specifically they don't have room so they arrange vertically instead of horizontally and take up a huge amount of screen real estate).

Semi-related, is there a way to overlay text on a button without saving separate images, each with the correct text? Just using a single template for buttons and then deciding what text goes on it as it's needed?

tl;dr: I'm trying to get a horizontal lineup of buttons for navigating my website, but I'm a noob and I can't do it right without your generous assistance.

© Stack Overflow or respective owner

Related posts about button

How can I change mouse keymapping

as seen on Ask Ubuntu - Search for 'Ask Ubuntu'
I have Razer DeathAdder(left handed edition) and A4Tech wireless mouse. My problem is I don't know how to change wireless mouse keymapping(swaping left/right click). Can somebody guide me how to do such thing? List of my devices: ? Virtual core pointer id=2 [master pointer… >>> More
Disable the asp button on click of the same button till the process ends

as seen on Stack Overflow - Search for 'Stack Overflow'
Hi, I need help in the following scenario: On click of a SAVE button in aspx page,some processing will take place. The processing can be of 10-15 minutes.I want to disable the SAVE button till process ends and once process completes, the SAVE button should be enabled. I tried the following… >>> More
Have Button re-appear immediately after clicking button in ListView row

as seen on Stack Overflow - Search for 'Stack Overflow'
I have 4 buttons on a page. Each button opens a modal window and let’s the user input data in a form. When the user hits the save button in the modal, a ListView appears on the page with the submitted data. The button the user clicked to open the modal window is set to visible=false, so it’s gone… >>> More
Show Add button after Edit button is clicked?

as seen on Stack Overflow - Search for 'Stack Overflow'
I have a view with navigation bar control on the top. The view is in the second level with a "back" button is displayed on the left by default. In my view class, I added a default navigation edit button on the right: self.navigationbarItem.rightButtonItem = self.editButtonItem; with this line of… >>> More
change the value of the button of the button clicked

as seen on Stack Overflow - Search for 'Stack Overflow'
On inserting the new <li>, I have to set the value of the button clicked to Delete. How can I do that? With the actual code, it`s working only once, and on adding other list, the button no more has the the value 'Delete'. $("#mylist :button").click( function() { var text = $(this)… >>> More

Related posts about rollover

Very simple jQuery rollover

as seen on Stack Overflow - Search for 'Stack Overflow'
I made a very simple jQuery img rollover function inspired by this one: http://www.smileycat.com/miaow/archives/000224.php. It just check all the imgs that contain _off in their name and swap them with an img with the same name but "_on" instead of "_off". Since I can't use background imgs in my… >>> More
jQuery Rollovers Not Preloading

as seen on Stack Overflow - Search for 'Stack Overflow'
$('.ro').hover( function(){ t = $(this); t.attr('src',t.attr('src').replace(/([^.]*)\.(.*)/, "$1_o.$2")); }, function(){ t = $(this); t.attr('src',t.attr('src').replace('_o','')); } ); I use this code so that (for examle) test.gif with the class… >>> More
Google Maps Rollover Problem in a Flex Website

as seen on Stack Overflow - Search for 'Stack Overflow'
Hi, I'm using Google Maps in my Flex site to create a map. I've got polygons overlayed on the map. When the user rolls over a polygon an infowindow opens identifying the area and the fill Alpha of the area is set to 0. On roll-out, the info window is removed and the fill Alpha is returned to the… >>> More
CSS Rollover button bug

as seen on Stack Overflow - Search for 'Stack Overflow'
Hi Everyone, I'm trying to create a drop down button and its almost working except one little bug. I have several big buttons that change background color when the user hovers over them and one of them, the language button, displays several suboptions inside itself when the user hovers over it. That… >>> More
Sub Menu Rollover Pop up Not Showing

as seen on Stack Overflow - Search for 'Stack Overflow'
Hello everyone, hopefully this will be an easy answer for some of you CSS veterans out there. I'm developing a site for a client. For readability, I'll just give you a link to the website and the css page in question. HTML CSS I'm trying to make a sub menu pop up to the right of the main menu when… >>> More