In Gtkmm how to remove the inset border from a scrolled window?I used a scrolled window that holds a image widget.The scrolled window itself appears within a Hbox.An inset border appears around the window which i want to remove.How?
I believe you can get rid of that using the Gtk::ScrolledWindow method set_shadow_type(Gtk::SHADOW_NONE)
Related
I put a box-shadow under a main content part. This works fine. However when scrolling, the main content is hidden behind the top parts (which have the same width as the main content parts) but the drop shadow is not. Is it somehow possible to show the shado only at thos parts where the element with the box-shadow is visible?
For illustration, here is an image
Even tho there is Code missing, I would suggest stretching the overlapping element over the window width. As the shadow is obviously not set to inset, and therefore rendered outside of the container boundaries.
I want the red box to cover the black box at all times, even when window is resized. The size of the box is 40px*40px and does not change in size when the window is resized. All the content changes in size except the black box. Also the distance from the top stays the same. How can I achive this so that the red box is always on top.
just create a div element which includes both
I will suggest using the same properties for the black and red(so that if you resize, they fall at the same place) and use the z-index to make sure that the red is on top.
I have a tricky CSS situation which I can't seem to solve.
I'd like the top portion of the body background to be one color (white), and then fill with another color (blue) from a certain position downward (below a footer in my case), and ensure that this color always fills (bleeds) to the bottom edge of of the browser window, regardless of window size.
I tried using a small blue bitmap, specifying the starting position via background-position, then applying background-repeat: repeat-y, but it fills in both directions.
I also thought of creating a long div but this affects the canvas size -- browser adds scroll bars, mobile will render the entire size -- no good.
Any ideas? (I'm not looking for a sticky footer) Thanks!
You should just add the background property in your footer instead.
Then you add some huge padding-bottom and add a negative margin-bottom of the same amount.
Just make sure you have an outter div with overflow: hidden;
FIDDLE
I have a very tall image that I'm using as a background for the body tag. However, the page may be longer than this image, so after a while I see the background color since I use no-repeat (the background is not a pattern).
Is there a way to keep the background scrollable, and then when I reach the end of the image, keep it "stuck" to the bottom, although the page keeps scrolling?
you need to use an extra fixed layer with the bottom of the picture setted to transparent, and then listen to the scroll event to detect when you reach the bottom of the original background, set the fixed layer visible and voila, you have it! If you need help in any of these, please provide a snippet of your code so I can implement in it for you.
I have an overlay that I created with a width of 700px and height of 500px.
The contents of it will be quite long though and so the user will have to be able to scroll up/down within the overlay.
Could I get a suggestion on how to set this up taking into consideration the fact that scroll bars vary in width in each browser?
For example if I add 15px of padding-right to the overlay wrapper, it displays great in Firefox.
The contents will fit perfectly within the div and a horizontal bar will not appear.
However in another browser, the vertical scroll bar may be 20px wide, this would cause the contents to be forced to scroll horizontally, or, if I disable overflow-x, they would be cut off by 5px on the right.
How can I get it so that, no matter the browser, when the vertical scroll bar appears, the width of the overlay wrapper adjusts so that its contents can be displayed perfectly with no horizontal scroll bar?
Overflow property sounds like what you need: overflow:scroll;? But I guess I'm not sure what your concern of the different width of scrollbars is. How is it setup that this is variable?
Or a different look at your problem, put the div with your overlay wrapper inside another div and have the new div have the scroll property, thus making it so the first directly has nothing to do with scroll bars. Ex: [link]
EDIT: Looking at example you provided, do you want something like this? Trick is like I said above putting div around everything, but instead not giving it a width and having it display:inline-block; (display) so it fits the child (but the scroll wheel stays outside of the child).
EDIT 2: Note if you need it to center on screen, you must have another parent div surrounding the inline-block, and have the inline-block text-align:center;. (example)
use max-width and jquery scrollbar plugin jscrollpane.
You can define the scrollbar width and styles for each browser, if the need it.
http://jscrollpane.kelvinluck.com/