- This topic is empty.
-
AuthorPosts
-
February 8, 2011 at 1:09 pm #31551justint24Member
Hi there
hope someone can help, i have this large white area at the right of my webpage i thought i solved this problem but didnt unfortunately, the problems lies in this menu css code i think
ul.dropdown,
ul.dropdown li,
ul.dropdown ul {
list-style: none;
margin: 0;
padding: 0;
}
ul#nav {
float: right;
position: relative;
z-index: 597;
}
ul.dropdown li {
float: left;
line-height: 1.3em;
vertical-align: middle;
zoom: 1;
}
ul.dropdown li.hover,
ul.dropdown li:hover {
position: relative;
z-index: 598;
cursor: default;
}
ul.dropdown ul {<
visibility: hidden;
position: absolute;
top: 100%;
left: 0;
z-index: 599;
width: 100%;
}
ul.dropdown ul li {
float: none;
}
ul.dropdown ul ul {
top: 1px;
left: 100%;
}
ul.dropdown li:hover > ul {
visibility: visible;
}previously i replaced ul.dropdown (the one with the arrow next to it) with ul#nav, it did remove the white area but the dropdown itself disappeared, so back to square one,
Sorry guys hope you can help
Thanks
February 8, 2011 at 2:01 pm #62131AkuseruParticipantHi there,
Are you doing this with a menu generator?
Do you have a web page for example?
All I can see it’s that the container (dropdown or nav) are 100% width and the items (li) are less than that.
Also I need to know if you want this menu centered or aling to right or left.
I hope to help you…
February 8, 2011 at 3:19 pm #62063justint24MemberHi Akuseru
sorry my website is http://www.webbid.co.uk
i want the menu to float right of the page, the menu itself was positioned left and i couldnt get it to float right so i renamed one element from ul.dropdown to ul#nav as you can see which worked but left me with the white margin area.
Thanks again.
February 8, 2011 at 4:54 pm #62041justint24MemberAs i mentioned in the first comment i thought i’d solved it but was mistaken, when i replaced the code with the arrow next to it to ul#nav the margin disappeared but the menu stopped working, so was back to having the margin.
And as for opening new discussions the last discussion had [solved] on it but it wasnt.
All my website is in pretty perfect working order i just need help on this problem, it would very much appreciated.
Thanks
February 8, 2011 at 4:58 pm #62042drizzyParticipantI’m having the same issue on my site too.
like on the first page it’s not too bad, but if I click on register and resize my window it starts to show the white space. mylaFebruary 8, 2011 at 5:54 pm #62046justint24MemberHi drizzy,
i dont think its the same problem we have, i’ve just looked at your site, theres no body width
example-
#body {
width: 100%;
}same with the header width:1165px; replace with width:100%;
February 9, 2011 at 1:36 am #61972justint24MemberI thought this was a website to help people out with problems they have with there websites, i came on here for help for a small problem hoping to find an answer.
nobody as yet given me a correct answer to my problem.
wolfcry your more interested in my errors than helping out and as for removing visibility: hidden; WHY thats just makes my dropdown menu visible doesnt make my margin go away.February 9, 2011 at 2:06 am #61975TheDocMember@justint24 – careful with your words! Many people dedicate hours of their time (for free) to help people solve their problems. An attitude like that will only turn them off from helping you.
February 9, 2011 at 2:57 am #61977justint24MemberI understand what you mean and didn’t mean to come across like that, I am very grateful for help I receive and very grateful for ideas, i would just like a little help and it would be very much appreciated, I’m sorry if I sound a little arrogant and ungrateful but I’m just a little frustrated, hope someone can help soon.
Thanks
JustinFebruary 9, 2011 at 3:30 am #61978jamygoldenMember@justint24, the menu is causing the problem. We have narrowed this down for you. Easy solution to the nav problem? find a new way of doing it. We are here to help you, not do the work for you. Here are a few tutorials for creating a dropdown menu.
http://www.alistapart.com/articles/horizdropdowns/
http://www.1stwebdesigner.com/css/38-jquery-and-css-drop-down-multi-level-menu-solutions/
http://css-plus.com/2010/06/how-to-make-a-jquery-drop-down-menu-with-a-css-fall-back/February 11, 2011 at 10:17 am #61079drizzyParticipantjustint24, thanks I tired 100% it helped abit, but caused problem when resizing my window and at the bottom footer the purple and orange color is now just cutting off more.
I can’t seem to figure this one out,
I think it has something to do with something in here.
/* topmenu */
div#topmenu {
height:76px;
padding:25px 0 0 0;
}div#topmenu div.topmenu_container {
height:53px;
position:relative;
float:left;
left:50%;
}div#topmenu ul {
list-style:none;
position:relative;
float:left;
left:-50%;
background:url(../images/topmenu_line.png) 100% 0 no-repeat;
}div#topmenu ul li {
float:left;
display:block;
font-family:Arial Black, Helvetica, sans-serif;
font-size:19px;
text-transform:uppercase;
background:url(../images/topmenu_line.png) 0 0 no-repeat;
padding:0 14px 0 18px;
height:27px;
}anyone have any suggestions TIA.
February 15, 2011 at 11:50 am #60199drizzyParticipantI managed to fix it somehow but the only issue I have is the logo at the top
doesn’t align with great deals all day every day underneath when I resize the browser.
Anyone have any idea why this is happening. TIA/* topmenu */
div#topmenu {
height:76px;
padding:25px 0 0 0;
}
div#topmenu div.topmenu_container {
height:53px;
position:relative;
float:left;
width:100%;
overflow:hidden;
}
div#topmenu ul {
list-style:none;
position:relative;
float:left;
background:url(../images/topmenu_line.png) 100% 0 no-repeat;
clear:left;
margin:0;
padding:0;
left:50%;
text-align:center;
line-height:20px;
}
div#topmenu ul li {
float:left;
display:block;
font-family:Arial Black, Helvetica, sans-serif;
font-size:19px;
text-transform:uppercase;
background:url(../images/topmenu_line.png) 0 0 no-repeat;
height:27px;
list-style:none;
margin:-4px 0 0 0;
padding:0 5px 0 8px;
position:relative;
right:50%;
}
div#topmenu ul li a {
color:#FFF;
text-shadow:#000 0 0 4px;
display:block;
margin:0 0 0 1px;
padding:3px 10px;
text-decoration:none;
line-height:1.3em;
}
div#topmenu ul li a:hover {
color:#000066;
text-shadow:#000 0 0 4px;
display:block;
margin:0 0 0 1px;
padding:3px 10px;
text-decoration:none;
line-height:1.3em; -
AuthorPosts
- The forum ‘CSS’ is closed to new topics and replies.