WebArtz - The Web Design Forum
Welcome to WebArtz, Guest!

WebArtz is a nice place for discussions related to web designing and coding. We help our members to code their own website templates with HTML and CSS. We give them advice on various issues.

To know more about WebArtz Forum, visit the About Us page.

At the moment, you are viewing the forum as a guest. As a guest you can't make post and participate in discussions. You need to register and become a member of the forum. Click the register link below and become a part of this forum.

Thank You

WebArtz - The Web Design Forum
Welcome to WebArtz, Guest!

WebArtz is a nice place for discussions related to web designing and coding. We help our members to code their own website templates with HTML and CSS. We give them advice on various issues.

To know more about WebArtz Forum, visit the About Us page.

At the moment, you are viewing the forum as a guest. As a guest you can't make post and participate in discussions. You need to register and become a member of the forum. Click the register link below and become a part of this forum.

Thank You


You are not connected. Please login or register

View previous topic View next topic Go down  Message [Page 1 of 1]

1how to change this css code menu Empty how to change this css code menu Thu Mar 08, 2012 3:49 pm

medlsc

medlsc
Registered Member
Registered Member
Hi Guys , i find this menu http://www.cssportal.com/css3-menu-generator/ and when i add the css code into the css stylesheet i don't have the same bar as it is in cssportal site. I don't see the colors.

how to change this css code menu Fsfsdf10


here the css code

#menu-bar {
margin: 0px 0px 0px 0px;
padding: 6px 6px 0px 6px;
height: 34px;
line-height: 100%;
border-radius: 24px;
-webkit-border-radius: 24px;
-moz-border-radius: 24px;
box-shadow: 2px 2px 3px #666666;
-webkit-box-shadow: 2px 2px 3px #666666;
-moz-box-shadow: 2px 2px 3px #666666;
background: #8B8B8B;
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr=#A9A9A9, endColorstr=#7A7A7A);
background: -webkit-gradient(linear, left top, left bottom, from(#A9A9A9), to(#7A7A7A));
background: -moz-linear-gradient(top, #A9A9A9, #7A7A7A);
border: solid 1px #6D6D6D;
}
#menu-bar li {
margin: 0px 6px 0px 6px;
padding: 0px 0px 6px 0px;
float: left;
position: relative;
list-style: none;
}
#menu-bar a {
font-weight: bold;
font-family: arial;
font-style: normal;
font-size: 12px;
color: #E7E5E5;
text-decoration: none;
display: block;
padding: 8px 20px 8px 20px;
margin: 0;
border-radius: 10px;
-webkit-border-radius: 10px;
-moz-border-radius: 10px;
text-shadow: 2px 2px 3px #000000;
}
#menu-bar .current a, #menu-bar li:hover > a {
background: #0399D4;
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr=#EBEBEB, endColorstr=#A1A1A1);
background: -webkit-gradient(linear, left top, left bottom, from(#EBEBEB), to(#A1A1A1));
background: -moz-linear-gradient(top, #EBEBEB, #A1A1A1);
color: #444444;
-webkit-box-shadow: 0 1px 1px rgba(0, 0, 0, .2);
-moz-box-shadow: 0 1px 1px rgba(0, 0, 0, .2);
box-shadow: 0 1px 1px rgba(0, 0, 0, .2);
text-shadow: 2px 2px 3px #FFFFFF;
}
#menu-bar ul li:hover a, #menu-bar li:hover li a {
background: none;
border: none;
color: #666;
-box-shadow: none;
-webkit-box-shadow: none;
-moz-box-shadow: none;
}
#menu-bar ul a:hover {
background: #0399D4 !important;
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr=#04ACEC, endColorstr=#0186BA);
background: -webkit-gradient(linear, left top, left bottom, from(#04ACEC), to(#0186BA)) !important;
background: -moz-linear-gradient(top, #04ACEC, #0186BA) !important;
color: #FFFFFF !important;
border-radius: 0;
-webkit-border-radius: 0;
-moz-border-radius: 0;
text-shadow: 2px 2px 2px #FFFFFF;
}
#menu-bar ul {
background: #DDDDDD;
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr=#FFFFFF, endColorstr=#CFCFCF);
background: -webkit-gradient(linear, left top, left bottom, from(#FFFFFF), to(#CFCFCF));
background: -moz-linear-gradient(top, #FFFFFF, #CFCFCF);
display: none;
margin: 0;
padding: 0;
width: 185px;
position: absolute;
top: 30px;
left: 0;
border: solid 1px #B4B4B4;
border-radius: 10px;
-webkit-border-radius: 10px;
-moz-border-radius: 10px;
-webkit-box-shadow: 2px 2px 3px #222222;
-moz-box-shadow: 2px 2px 3px #222222;
box-shadow: 2px 2px 3px #222222;
}
#menu-bar li:hover > ul {
display: block;
}
#menu-bar ul li {
float: none;
margin: 0;
padding: 0;
}
#menu-bar ul a {
padding:10px 0px 10px 15px;
color:#424242 !important;
font-size:12px;
font-style:normal;
font-family:arial;
font-weight: normal;
text-shadow: 2px 2px 3px #FFFFFF;
}
#menu-bar ul li:first-child > a {
border-top-left-radius: 10px;
-webkit-border-top-left-radius: 10px;
-moz-border-radius-topleft: 10px;
border-top-right-radius: 10px;
-webkit-border-top-right-radius: 10px;
-moz-border-radius-topright: 10px;
}
#menu-bar ul li:last-child > a {
border-bottom-left-radius: 10px;
-webkit-border-bottom-left-radius: 10px;
-moz-border-radius-bottomleft: 10px;
border-bottom-right-radius: 10px;
-webkit-border-bottom-right-radius: 10px;
-moz-border-radius-bottomright: 10px;
}
#menu-bar:after {
content: ".";
display: block;
clear: both;
visibility: hidden;
line-height: 0;
height: 0;
}
#menu-bar {
display: inline-block;
}
html[xmlns] #menu-bar {
display: block;
}
* html #menu-bar {
height: 1%;
}


i use phpbb3 version.

http://med-lab-scietists.free-forums.biz/

2how to change this css code menu Empty Re: how to change this css code menu Thu Mar 08, 2012 6:54 pm

ankillien

ankillien
Administrator
Administrator
Can you post like tot he forum? The image looks like of a punBB forum.

3how to change this css code menu Empty Re: how to change this css code menu Thu Mar 08, 2012 7:40 pm

medlsc

medlsc
Registered Member
Registered Member
i change the version of my test forum :http://proxeirooo.forumgreek.com/

i thing that i must change something in the previously css3.

as a example: i change the background: #8B8B8B; to background-color: #8B8B8B;

but i don't know what i change more.

http://med-lab-scietists.free-forums.biz/

4how to change this css code menu Empty Re: how to change this css code menu Thu Mar 08, 2012 7:51 pm

ankillien

ankillien
Administrator
Administrator
The menu looks totally fine to me! What does it show wrong on your side?

5how to change this css code menu Empty Re: how to change this css code menu Thu Mar 08, 2012 8:04 pm

medlsc

medlsc
Registered Member
Registered Member
where you put the html code ?

http://med-lab-scietists.free-forums.biz/

6how to change this css code menu Empty Re: how to change this css code menu Thu Mar 08, 2012 8:06 pm

ankillien

ankillien
Administrator
Administrator
No, I mean it looks fine to me on your forum http://proxeirooo.forumgreek.com/
It seems to be working correctly.

7how to change this css code menu Empty Re: how to change this css code menu Thu Mar 08, 2012 8:10 pm

medlsc

medlsc
Registered Member
Registered Member
I change some backgroung color and for this reason you see this bar . Look at my test forum now. http://proxeirooo.forumgreek.com/ I put the original css3 code from the cssportal site.

I want this menu bar
http://www.cssportal.com/css3-menu-generator/

http://med-lab-scietists.free-forums.biz/

8how to change this css code menu Empty Re: how to change this css code menu Thu Mar 08, 2012 8:35 pm

ankillien

ankillien
Administrator
Administrator
This is how it looks on cssportal.com...

how to change this css code menu Image_1

and this is how it looks on your site...

how to change this css code menu Image_2

9how to change this css code menu Empty Re: how to change this css code menu Fri Mar 09, 2012 3:36 am

medlsc

medlsc
Registered Member
Registered Member
xaxaxa. I found where is the problem. I use linux ( ubuntu 11.10 ) and for this reason i don't show the menu bar as it is in the cssporta site. When I turned my computer on windows i saw the menu bar.

http://med-lab-scietists.free-forums.biz/

Sponsored content


View previous topic View next topic Back to top  Message [Page 1 of 1]

Permissions in this forum:
You cannot reply to topics in this forum