Jump to content



Recommended Posts

Good evening everybody! Hope all is well with you! First of all, my english is not the best. Please understand! Is there any way I can get these buttons next to each other? Here is the link to the button: http://project.jimmylindblom.se/ I have put them as a list with ul and il, and will put them as a menu in a wordpress theme. Instead of now, they are putting them selves above each other. I do want them in the style now, with shadow etc, and right now I have "position: absolute", which I guess I'll have to change to get them into the right order? The reason I want to run them as a list, is that I want to be able to add and remove features from the wordpress-theme and therefore not the buttons have the exact position of the "position: relative". Does anyone know how I can getto the style of the buttons in a similar way? Instead of start making those buttons as image files. Grateful for any help! And did I forget some information here, please tell me, and I will give you answers! The code:

<html><head><meta http-equiv="Content-Type" content="text/html; charset=UTF-8" /><title>Untitled Document</title><style type="text/css"><!-- #menu {   position: relative;   float: right;   width: 400px;   padding-left: 70px;   padding-right: 30px;} #menu a:hover {   background-color: #d8d8d8;} #menu a:active {   top:22px;   box-shadow: none;   -moz-box-shadow: none;   -webkit-box-shadow: none;} #menu li {   float: right;   margin: 1px 1px 1px 1px;   height: 21px;   overflow: hidden;} #menu ul {   font-size: 20px;   list-style: none;} #menu a {   display: inline-block;   position: absolute;   top: 20px;   padding: 0 15px;   font-size: 16px;   height:38px; line-height:38px;   font-weight: bold;   -webkit-border-radius: 4px;   -moz-border-radius: 4px;   border-radius: 4px;   text-decoration: none;   background-color: #f2f2f2;   color: #888888;   box-shadow: 0px 2px 0px #c6c6c6;   -moz-box-shadow: 0px 2px 0px #c6c6c6;   -webkit-box-shadow: 0px 2px 0px #c6c6c6;   right: 25px;   -webkit-font-smoothing: antialiased;} --></style></head> <body> <div id="menu">			<ul><li><a href="#">Button Button Button Button</a></li>			   <li><a href="#">Button 1</a></li>			</ul>		 </div></div>  </body></html>

Have a nice day! Thanks! Best regards,J

Link to comment
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now

  • Create New...