Wordpress Themes - WP Forum at BFA
Click here to register or to donate.
Auto self-registration is not available here - far too many spammers. This forum has many, many backlinks and because of that there is an intense desire among spammers to drop their links here.

Wordpress Themes - WP Forum at BFA » WordPress Themes » Atahualpa 3 Wordpress theme » Page & Category Menu Bars »

Nav Button Width


  #1  
Old Sep 8, 2014, 10:32 AM
BywayWriter
 
27 posts · Mar 2013
For some reason I can't get a vertical nav button set to be the same width. Width is being determined by the number of characters of content in the button. the min-width and width calls aren't doing the trick. Can someone help?

Code:
#button1 ul { 
  min-width: 300px;
  padding: 5px; 
  list-style: none; 
  text-align: left; 
  font-size: 1.3em;
  background-color: #fff; 
  } 
 
#button1 ul li {  
  display: block; 
  margin: 25px 0 25px 0;
  padding: 12px 0 0 0; 
  } 
 
#button1 ul li a { 
  width: 2em;
  border-top: 1px solid #67527a;
  background: #3b185a;
  background: -webkit-gradient(linear, left top, left bottom, from(#67527a), to(#330c57));
  background: -webkit-linear-gradient(top, #67527a, #3b185a);
  background: -moz-linear-gradient(top, #67527a, #3b185a);
  background: -ms-linear-gradient(top, #67527a, #3b185a);
  background: -o-linear-gradient(top, #67527a, #3b185a);
  padding: 12px 24px;
  -webkit-border-radius: 11px;
  -moz-border-radius: 11px;
  border-radius: 11px;
  text-shadow: rgba(0,0,0,.4) 0 1px 0;
  color: #ffffff;
  font-size: 1.3em;
  text-decoration: none;
  vertical-align: middle;
  } 
 
#button1 ul li a:hover { 
  border-top-color: #3b185a;
  background: #3b185a;
  color: #f2f769;
  }
  #2  
Old Sep 8, 2014, 10:47 AM
juggledad's Avatar
juggledad
 
23,572 posts · Mar 2009
OSX 10.11.5 WP 4.x Atahualpa(all) Safari, Firefox, Chrome
what is the url?
__________________
"Tell me and I forget, teach me and I may remember, involve me and I learn." - Benjamin Franklin
Juggledad | Forum Moderator/Support
  #3  
Old Sep 8, 2014, 10:49 AM
BywayWriter
 
27 posts · Mar 2013
http://depts.washington.edu/uwhsa/login/
  #4  
Old Sep 8, 2014, 11:45 AM
juggledad's Avatar
juggledad
 
23,572 posts · Mar 2009
OSX 10.11.5 WP 4.x Atahualpa(all) Safari, Firefox, Chrome
where do you think that css should be applied? i.e. what html element has a ID of 'button'?
__________________
"Tell me and I forget, teach me and I may remember, involve me and I learn." - Benjamin Franklin
Juggledad | Forum Moderator/Support
  #5  
Old Sep 8, 2014, 12:15 PM
BywayWriter
 
27 posts · Mar 2013
Here is the HTML for the page utilizing the above CSS.

Code:
<div id="button1">
<ul>
	<li><a href="http://depts.washington.edu/uwhsa/login/supervisors/">HSA Supervisors</a></li>
	<li><a href="http://depts.washington.edu/uwhsa/login/ipe-committee/">IPE Committee</a></li>
	<li><a href="http://depts.washington.edu/uwhsa/login/uw-healthcare-component-compliance-group">Healthcare Compliance</a></li>
</ul>
</div>
  #6  
Old Sep 8, 2014, 12:54 PM
juggledad's Avatar
juggledad
 
23,572 posts · Mar 2009
OSX 10.11.5 WP 4.x Atahualpa(all) Safari, Firefox, Chrome
I do not see that HTML in the source of the page you pointed to.
__________________
"Tell me and I forget, teach me and I may remember, involve me and I learn." - Benjamin Franklin
Juggledad | Forum Moderator/Support
  #7  
Old Sep 8, 2014, 01:12 PM
BywayWriter
 
27 posts · Mar 2013
It is a password-protected page using the wp-members plugin. So only employees have access to the page with the buttons. Sorry about that.

So as far as you see in the CSS and HTML it should work?
  #8  
Old Sep 8, 2014, 01:21 PM
juggledad's Avatar
juggledad
 
23,572 posts · Mar 2009
OSX 10.11.5 WP 4.x Atahualpa(all) Safari, Firefox, Chrome
Not seeing the correct page, I can't tell what CSS might be applied.
__________________
"Tell me and I forget, teach me and I may remember, involve me and I learn." - Benjamin Franklin
Juggledad | Forum Moderator/Support

Bookmarks

Thread Tools Search this Thread
Search this Thread:

Advanced Search
Display Modes


Similar Threads
Thread Thread Starter Forum Replies Last Post
I want a full width header, fixed width content and a background image tsheridan Header configuration & styling 5 Jan 29, 2013 03:46 PM
[SOLVED] Full width header with fixed width image and background color WilliamNavidson Header configuration & styling 4 Jun 10, 2011 03:13 AM


All times are GMT -6. The time now is 09:23 AM.


Powered by vBulletin® Copyright ©2000 - 2018, Jelsoft Enterprises Ltd.