SitePoint Sponsor |
|
User Tag List
Results 1 to 4 of 4
-
Aug 18, 2004, 12:22 #1
- Join Date
- Feb 2004
- Location
- amsterdam
- Posts
- 22
- Mentioned
- 0 Post(s)
- Tagged
- 0 Thread(s)
Control (simple) button lay out from CSS
Dear list participants,
In the project I’m doing I should like to control button lay out (text in a simple box with rollover-effect) from a style sheet.
Is there a way to represent <a href >BUTTONTEKST</a> or <a href class="button">BUTTONTEKST</a> as a button? Preferably a secure way concerning browser compatibility (tareget browsers, ie5+, mac-ie5, mac-safari and opera7).
Can anybody help me or point me a good source?
Thanks a lot,
Regards,
Igor
-
Aug 18, 2004, 14:12 #2
- Join Date
- Jul 2003
- Location
- Springfield, MO
- Posts
- 1,867
- Mentioned
- 0 Post(s)
- Tagged
- 0 Thread(s)
Something like this could work:
Code:#sidebar a{ /*/*/padding:3px; display:block; border:2px dotted #CCC; text-decoration:none; line-height:1em; width:160px;/**/ } /*defines my default link and visited link styles*/ #sidebar a:link, #sidebar a:visited{ color:#666; } /*defines my hover and active link styles*/ #sidebar a:hover, #sidebar a:active{ color:#FFFFFF; background-color:#CC0000; border:2px solid #000; }
Code:#sidebar a{ /*/*/ display:block; }
Hope this helps. Paul, feel free to critique me if you feel the need, lol.
-
Aug 18, 2004, 14:22 #3
- Join Date
- Mar 2004
- Location
- Lovely Leipzig
- Posts
- 166
- Mentioned
- 0 Post(s)
- Tagged
- 0 Thread(s)
1. This will give you a button effect without using images.
http://alistapart.com/articles/rollovers/
2. This is how to do css rollover buttons with no preloader (excellent idea, really easy to do and works beautifully across browsers)
http://wellstyled.com/css-nopreload-rollovers.html
3. This is a more advanced version of the tabs in the site above
http://alistapart.com/articles/slidingdoors/
There's a second part to this article that expands further but since you didn't ask about tabs I'll leave you to have a rummage for it. It's not hard to find.
Good luck,
John
-
Aug 18, 2004, 15:12 #4
- Join Date
- Jan 2003
- Location
- Hampshire UK
- Posts
- 40,556
- Mentioned
- 183 Post(s)
- Tagged
- 6 Thread(s)
Hi Igor,
This isn't what you want but I thought it worth mentioning as we're talking rollovers here
This is the only way to achieve pre-loaded rollovers without flicker and without the ie hourglass (which all other method fail at).
http://www.pmob.co.uk/temp/cssrollover4.htm
Its not pretty but it works very well. I know its not what you wanted but it seemed like it was good to have a reference to it here for completeness.
Paul
Bookmarks