Back To Start Of Archive
Taken From The Forum: Help & Support for DHTML Menu Version 5+
Forum Topic: Click to view post
Last Updated: Saturday July 14 2012 - 06:07:53
Borderstyle
Poster: Maz
Dated: Friday December 5 2003 - 20:23:11 GMT
Hi guys
I'm lost in css, now trying borderstyle and don't get it.
In styles I put: borderstyle="miloborder";
In stylesheet I put:
.miloborder{
border-bottom: 4px solid #c5c5c5;
}
What am I doing wrong?
I haven't even got to ON borderstyle.
Thanks
maz
Poster: Ruth
Dated: Saturday December 6 2003 - 22:35:26 GMT
I think I'm more lost than you are...there's an ON borderstyle? I thought that with the .whatevername you used onclass in the menu_data.js file? But, I don't actually know what I'm doing.
Poster: pat __at__ dracoblu.com
Dated: Monday December 8 2003 - 17:33:18 GMT
Try breaking out border-bottom as follows:
border-bottom-width: 3px
border-bottom-style: solid
border-bottom-color: #c5c5c5
Poster: Maz
Dated: Monday December 8 2003 - 21:36:52 GMT
I tried, still nothing, am I doing it wrong?
Thanks
maz
Poster: pat __at__ dracoblu.com
Dated: Monday December 8 2003 - 21:58:05 GMT
It is not obvious to me that you can have a style command called for in the manner you wish. All the style properties appear to be contained within the menu_data.js file, such that borderstyle is specifically for solid, dotted or dashed lines.
I may very well be wrong about this, but perhaps someone else can comment.
Poster: Maz
Dated: Monday December 8 2003 - 22:44:26 GMT
Yes, I can understand that border color on and off would be different.
I'll give it another try.
Would something like this work?
borderstyle="style={border-bottom:4px;border-bottom:solid;}";
A definitive guide on using borderstyle would be nice.
Thanks,
maz
Poster: Ruth
Dated: Tuesday December 9 2003 - 6:24:50 GMT
By what you have in the first post it seems you want nothing but a bottom border of 4px solid the color you listed but not sure if you want it always on. I've never used style sheets, I always put it in the head of the page. I may be way off what it is you want to do, but here's a link to a page with only a one cell menu showing different style of borders on the menu/submenus using style in the head and onclass/offclass in the menu_data.js file.
http://www.poems2u.com/1/border.htm
Ruth
Poster: pat __at__ dracoblu.com
Dated: Tuesday December 9 2003 - 7:51:57 GMT
Borderstyle strictly relates to the type of line you desire. For example, the ones I am aware of include: solid, double, dashed, dotted, ridge, groove, inset, and outset. (You can also omit this attribute altogether by leaving things blank.) For example in menu_data.js:
borderstyle="solid"
borderstyle="dashed"
borderstyle="dotted" etc.
I would suggest you ask Andy if the menu_data.js file can be accommodated to add other style attributes like:
border-bottom-style
border-bottom-color
border-bottom-width
border-left-style
border-left-color etc.
Unless I am wrong, at the moment only 3 border style attributes are permitted in the menu_data.js file including borderstyle, bordercolor and borderwidth.
Poster: Maz
Dated: Tuesday December 9 2003 - 8:11:32 GMT
This gets me one border-bottom on the main menu but no onborder.
Using borderstyle, offclass, onclass.
Code:
.miloborder{
border-bottom: 4px;
}
.miloborderoff{
background: #ffffff;
border-bottom: solid #c5c5c5;
}
.miloborderon{
background: #ffffff;
border-bottom: solid #ff0033;
}
Thanks,
maz
Poster: pat __at__ dracoblu.com
Dated: Tuesday December 9 2003 - 8:55:14 GMT
Try this
.miloborder{
border-bottom-width: 4px;
}
.miloborderoff{
background: #ffffff;
border-bottom-style: solid;
border-bottom-color: #c5c5c5;
}
.miloborderon{
background: #ffffff;
border-bottom-style: solid;
border-bottom-color: #ff0033;
}
Poster: Ruth
Dated: Tuesday December 9 2003 - 19:59:10 GMT
Maz, I'm getting lost in all the various codes and such, what is it exactly you want to happen or want the menu to do?
Ruth
Poster: Maz
Dated: Tuesday December 9 2003 - 20:29:20 GMT
HI,
If you look at -www- below you see 'tools menu' and a horizontal menu on the same line. Because I cannot get 100% line accross the page, the line you see is css underneath the menu (same as footer menu).
Currently I have the bottom border working on both menus, the on border should turn red.
I used to have a background image that looked like a border, but on the old computer it kept repeating the background down the page and probably took longer to load.
I'm still getting the followscroll 'tools menu' repeating on first load, I'm still hoping it clears up eventually.
One of the problems with using border on the main menu, is the subimage, it creates 2 border bottoms, only by using borderstyle do I get one border.
If I put 4px in onclass or offclass, I get a border under the subimage and a border under the 'text & subimage'.
I see Andy mentions something like, borderstyle can use all css values but what's it saying about style.borderstyle, I'm not sure what that means. Perhaps I'm supposed to make the css miloborder.borderstyle{
If I change that somehow what do I do with borderstyle="miloborder.borderstyle"? or 'miloborder' either way its not clear and I don't get it.
Thanks,
maz
Poster: Ruth
Dated: Wednesday December 10 2003 - 0:11:06 GMT
I downloaded and tried a number of things with the page. It is the image and subimage code that is causing the problem.
I put up a test page using your files but with changes I made. {I only made changes in the main menu, not the tools menuhttp://www.poems2u.com/1/styletest.htm
I think the reason the long border doesn't go all the way across is because I don't have the headers or footers and divs and such on the page.
The only solution I found was to get rid of the image and subimage code and put this into the actual item line
Code:
aI("text=<img src=xarrowdn.gif border=0> About Us;showmenu=aboutus;cursor=arrow;status=submenu about us;");
That means that the arrow won't change when the mouse goes over it, but that's all I could figure out. I even tried the image/overimage but that just gave the same problem you now have. I had to change the 'pointer=arrow to cursor=arrow because the IE5.0 browser on my pc kept giving me an 'invalid cursor code' error message whenever I put it over the link instead of giving me the submenu. This is what I did to your data file
Code:
with(xptopmain=new mm_style()){
oncolor="#ff0033";
offcolor="#6699ff";
borderstyle="miloborder";
offclass="miloborderoff";
onclass="miloborderon";
padding=3;
fontsize="11px";
fontfamily="tahoma, verdana, sans-serif";
pagecolor="#ff0033";
pagebgcolor="transparent";
menuwidth="100%";
itemheight="24px";
}
In your style sheet try changing the code to this oncolor="#ff0033";
offcolor="#6699ff";
borderstyle="miloborder";
offclass="miloborderoff";
onclass="miloborderon";
padding=3;
fontsize="11px";
fontfamily="tahoma, verdana, sans-serif";
pagecolor="#ff0033";
pagebgcolor="transparent";
menuwidth="100%";
itemheight="24px";
}
Code:
.miloborder{
border-bottom-width: 4px;
}
.miloborderoff{
background: #ffffff;
border-top:0px;border-right:0px;border-left:0px;border-bottom: 4px solid #c5c5c5;
}
.miloborderon{
background: #ffffff;
border-bottom: 4px solid #ff0033;
}
border-bottom-width: 4px;
}
.miloborderoff{
background: #ffffff;
border-top:0px;border-right:0px;border-left:0px;border-bottom: 4px solid #c5c5c5;
}
.miloborderon{
background: #ffffff;
border-bottom: 4px solid #ff0033;
}
Ruth
Code: