i am trying to create a sub navigation which is followed by seperator line (div with a bottom border) which acts as a visual cue.
but the line is appearing below the menu items. not sure how to get it right
http://jsbin.com/ijewi4
not sure about what you want to achieve but if you want to make the div "sit exactly at the bottom of the button tabs":
http://jsbin.com/ijewi4/3
I don't really like the hr element, i always use a div with a border-bottom.
That may work for you too.
Related
I have a div that is sized by placing left:260px to make it stay to the right of the menu bar, as seen in Before. but once the user try to highlight something, it went to the right with 260px extra. It is sized for responsiveness so I use 100% but can't get a right percentage to prevent that from happened. Any idea how can I fix that? Preferably CSS directly, not calc or jquery. thanks
I'll try to simplify my problem to make it easier to understand.
I want to be able to add lines of text (using javascript) to the document at the bottom of the page.
When a new line is pushed, it's added at the bottom, pushing all the previous lines up.
The document should be padded and when the content overflows the older lines (top ones) should be hidden or using scroll in which case it should be scrolled to the bottom.
I've been trying to accomplish this for a while now but I can't any elegant solutions.
Any ideas? css3 is more than welcomed.
Thanks.
There is an HTML element do this by default it is UL just include it inside an fixed height div with overflow and some focus on the last LI!
I'm going to create an special floating menu like this site:
http://www.just-eat.co.uk/restaurants-toscana/menu
as you can see, Categories and Your Order menus float in screen so that their position is almost always the same, and they always stick to top of screen (of course after you scroll the page down), how can I create this effect in ASP.NET? I've set my menu style position property as fixed, but in this way, my menu always has the same position, I want my menus to stick to top of screen
Not sure if ASP.NET has such feature by default. Never seen something like that in it. But it could be done easily with CSS position:fixed placed on top most div of your menu block or using plugin like this, for instance. Please note that position:fixed may cause problems in old browsers
Hello Ali you must add stylesheet in order to float your menu, but you don't have property in order to float your menu basicaly
You can keep the position of the div to position:fixed.
By doing that its position will be relative to the position to browser window and it will appear to be fixed.
Here is Sample Fiddle
More on CSS Fixed Positioning.
Ah, yet another CSS issue I'm having.
I'm attempting to use custom buttons, replacing a LinkButton with an image. I have the button working, but now the content below the button is not being pushed down. Have tried various things, but can't seem to find the answer.
Here's a jFiddle: http://jsfiddle.net/3hm5W/
Basically, the div id = sampleForm (the white form box) should start 5px after the div class = action-buttons. Currently the white box contains the red button.
All of the contents of your action-buttons are being absolutely positioned, which takes them out of the normal flow and makes the container have 0 height. Either get rid of the absolute positioning, or specify a height for your action-buttons div.
I have a Radmenu which has 6 buttons in it which need to have equal spacing between them in my horizontal menu. I have managed to get this right using a percentage value but what if someone decides to add another menu button?
Is there a way of aligning my UL menu in the middle of my wrapping DIV and then spacing the buttons equally.
To top this off, the left button needs to be floated left and the rmLast button needs to be floated right, then the buttons needs to be distributed evenly.
Many thanks!
James
This is one of those problems that could be solved with a table in about 20 seconds.
Anyway, the following link might help:
http://joomlapanel.com/joomla-article/joomla-tutorial/247-fixed-a-liquid-columns-with-css-a-jquery-.html
This technique uses a combination or stylesheets and javascript (jQuery) to accomplish this.