overflow - AngularFixing

June 11, 2022 CSS

How to move the scrollbar away from the right border of a component

Issue In an application I display data in table form. The main columns are grouped in the red frame representing the parent component. I want to add an additional summary column on the right outside the scrollable area. what I

June 8, 2022 CSS

Pseudo element is not scrollable when it has a transparent background

Issue I have some text displaying in an ::after psuedo element that I would like to be scrollable. It works fine until I change the background of that element from: background-color: rgb(0,0,0); to: background-color: rgba(0,0,0,0.5); Is there a way to

June 6, 2022 CSS

Responsive 2 column css layout with one column overflow horizontal scroll

Issue I’ve got a responsive 2 column layout going on. The first column is a fixed width, while the second one is using the css calc property to subtract certain pixels from its 100% width. What I want the second

June 5, 2022 CSS

Why does this CSS example use "height: 1%" with "overflow: auto"?

Issue I am reading a HTML and CSS book. It has a sample code of two-column layout. <!DOCTYPE html PUBLIC “-//W3C//DTD XHTML 1.0 Transitional//EN” “http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd”> <html> <head> <style> #main {height: 1%; overflow: auto;} #main, #header, #footer {width: 768px; margin: auto;}

June 2, 2022 HTML

CSS overflow-x: visible; and overflow-y: hidden; causing scrollbar issue

Issue Suppose you have some style and the markup: ul { white-space: nowrap; overflow-x: visible; overflow-y: hidden; /* added width so it would work in the snippet */ width: 100px; } li { display: inline-block; } <div> <ul> <li>1</li> <li>2</li>

June 2, 2022 HTML

I am having an overflow issue with my website in split screen at max-width 1200px

Issue I am having an issue with my website. When I put it in split screen with max-width 1200px, there is a little bit of overflow with the website that creates a horizontal scrollbar on the website. I need some

June 2, 2022 HTML

HTML table with horizontal scrolling (first column fixed)

Issue I have been trying to think of a way to make a table with a fixed first column (and the rest of the table with a horizontal overflow) I saw a post which had a similar question. but the

May 27, 2022 HTML

overflow-x div child width

Issue I’m trying to find a solution for this case: I have a div container with a static width and overflow-x: auto; 2 child divs, one of them has fixed width, the other one doesn’t. How can I make div

May 20, 2022 CSS

Bottom borderRadius not showing in React Native view

Issue I am currently trying out React Native for the first time and wanted to make a quick restaurant review app to try it out. Currently I have the issue that for my restaurant cards it’s not showing the bottom

May 18, 2022 CSS

Why does my element have a scrollbar even though it fits its container?

Issue I am writing code in jsPsych (a JavaScript library) and am trying to display a + on my screen. The + has a maximum height of 85vh and a maximum width of 85vw, though it does not reach either

May 18, 2022 CSS

CSS: How to have position:absolute div inside a position:relative div not be cropped by an overflow:hidden on a container

Issue I have 3 levels of div: (In green below) A top level div with overflow: hidden. This is because I want some content (not shown here) inside that box to cropped if it exceeds the size of the box.

May 18, 2022 CSS

React page width optimization

Issue I’m trying to make a website with React. I tried pure css and then decided to use react-bootstrap. Both ways didnt solve my problem. I have overflow towards right side of my page and if I use overflow-x:hidden, my

May 13, 2022 HTML

Overflow in footer

Issue I have a footer with the follow code: <div class="footer" style="width: 100%;"><h5> <a style="width: 30%; float: left; margin-left: 2.5%; background: #030534; color: white;" href="descontos.html">Vantagens</a> <a style="width: 30%; float: left; margin-left: 2.5%;" href="descubra.html">Novidades</a> <a style="width: 30%; float: left; margin-left: 2.5%;"

May 13, 2022 CSS

Can grid items wrap?

Issue How can I make the grid-items wrap inside their container? cause whenever input 64 as a new grid size the grid-items would overflow out of its container. I want the grid-items to adjust to the size of the grid-container.

May 12, 2022 CSS

Why is this inline-block element pushed downward?

Issue Following is my code and I want to understand that why #firstDiv is being pushed downward by all browsers. I really want to understand the inner workings of the fact that why its being pushed downward rather than pulling

May 12, 2022 CSS

How to make CSS long column text widen grid instead of overflowing?

Issue I’m currently refactoring one of my Firefox addons and I noticed an issue that arises with one of the translations: I’ve got a tab switch that is a CSS grid with 2 columns, both of which have a width

May 11, 2022 CSS

Why Does The overflow-y Property Not Work With Percent Height

Issue I’m trying to use percentage height with overflow-y:auto; and instead of creating a scroll bar on the side of the div, it’s using the page scroll bar. Here’s an example of want I’m getting at: http://jsfiddle.net/hmwe2jty/ Is it possible

May 8, 2022 CSS

CSS overflow:hidden hiding a list's bullets?

Issue I’ve just noticed something funny. Let’s say I have a HTML list: <ol> <li>Lorem</li> <li>ipsum</li> <li>dolor</li> <li>sit amet enim. Etiam ullamcorper. Suspendisse a pellentesque dui, non felis. Maecenas malesuada elit lectus felis, malesuada ultricies. Curabitur et ligula.</li> </ol> And

May 8, 2022 CSS

Why is this inline-block element pushed downward?

May 8, 2022 CSS

Why Does The overflow-y Property Not Work With Percent Height

May 5, 2022 CSS

Text overflow ellipsis on dynamic width element

Issue I’m having some issues trying to get text-overflow: ellipsis to work on an element with dynamic width. I’ve looked into other solutions but all of them seem to use some form of static width, whereas I’m hoping to achieve

May 5, 2022 CSS

CSS: the relative positioned element is now working when adding overflow-x

Issue I want to make the images in day_time_block can cover the title class. I also want to make all contents in day_time_block can be shown by overflow-x, but when adding overflow-x: auto; in scroll div, the images in day_time_block

April 23, 2022 CSS

How to not vertically overflow table cells and print the table?

Issue I know there are a lot of questions about that, but none of their solutions worked for me. I have an html page formed by only a table (that I want print), I want the table to perfectly fit

April 22, 2022 CSS

How to not vertically overflow table cells and print the table?

Issue I know there are a lot of questions about that, but none of their solutions worked for me. I have an html page formed by only a table (that I want print), I want the table to perfectly fit

April 22, 2022 CSS

Iframe overflow takes a new line instead of a scroll bar

Issue I created a web site that shows the directory list in the server. In backend all the directories are getting indexed and shown in an another webpage called dirpage. So I used an iframe in mainpage to show the

April 22, 2022 HTML

Iframe overflow takes a new line instead of a scroll bar

April 21, 2022 CSS

Bootstrap button drop-down inside responsive table not visible because of scroll

Issue I have a problem with drop-down buttons inside tables when are responsive and scroll active because the drop-down is not visible because of overflow: auto; property. How can I fix that in order to show drop-down option of button

April 21, 2022 CSS

Bootstrap button drop-down inside responsive table not visible because of scroll

April 20, 2022 CSS

SVG floating out it's Anchor container

Issue How can I fix the <a> and make it contain all the SVG icon. and also plz plz, How to remove the underline area of the <a> element?? photo for illustration a { background-color: rgba(42, 165, 42, 0.596); text-decoration:

April 20, 2022 CSS

SVG floating out it's Anchor container

April 15, 2022 CSS

parent & child with position fixed, parent overflow:hidden bug

Issue I don’t know if there is an issue, but I was wondering why the overflow:hidden does not function on fixed parent/children element. Here’s an example: CSS and HTML: .parent{ position:fixed; overflow:hidden; width:300px; height:300px; background:#555; } .children{ position:fixed; top:200px; left:200px;

April 15, 2022 CSS

Why is overflow-y required for a CSS parallax effect?

Issue I have created a barebones parallax demo. This works fine, as you can see if you run the snippet below. However, it stops working if I remove the following CSS rule: main { overflow-y: auto; } Why is it

April 13, 2022 HTML

Div height 100% and expands to fit content

Issue I have a div element on my page with its height set to 100%. The height of the body is also set to 100%. The inner div has a background and all that and is different from the body

April 12, 2022 CSS

How to limit a table cell to one line of text using CSS?

Issue I have a table of users where each row contains their names, e-mail address, and such. For some users this row is one text line high, for some others two, etc. But I would like that each row of

April 11, 2022 CSS

Content after height 100% container not being pushed down

Issue I have three children elements (.inner) inside a container (.container) with height 100%. After that, I have another div (.post) that is not being pushed down under the container. Here’s a fiddle http://jsfiddle.net/yVDXQ/526/ HTML: <html> <body> <div class=”container”> <div

April 11, 2022 CSS

Find offset relative to parent scrolling div instead of window

Issue I have a scrolling element inside a window. Say a division having a class “currentContainer” with overflow auto and that division contains huge amount of text so that it is definitely large enough to be scrolling. Now I have

April 10, 2022 CSS

CSS table width 100% and td overflow hidden with no td width

Issue I have a table using a 100% area width, and it has some td with overflow hidden, what I need is make their texts ellipsis when text is too long. I can do it using fixed td sizes, but

April 10, 2022 CSS

When I scale an element I want see the vertical overflow but set invisible the horizontal overflow

Issue I have several .cards inside my container. When I go with the mouse over a card I zoom in the card with the property scale(1.5). But I want that the zoomed in card overflow the container instead the part

March 24, 2022 CSS

Why does margin add space outside parent element?

Issue My css margins doesn’t behave the way I want or expect them to. I seems like my header margin-top affect the div-tags surrounding it. This is what I want and expect: …but this is what I end up with:

March 23, 2022 CSS

css overflow – only 1 line of text

Issue I have div with the following css style: width:335px; float:left; overflow:hidden; padding-left:5px; When I insert, into that div, a long line of text, it’s breaking to a new line and displays all the text. What I want is to

March 15, 2022 CSS

Fieldset with `max-height: 0` always overflows on Chrome v87+

Issue On Chrome 86, a fieldset with a max-height less than the height of its contents and overflow: hidden would hide the contents of that fieldset. However, on Chrome v87 (87.0.4280.67), this apparently changed. If a height is set that

March 15, 2022 HTML

Prevent flexbox div from going under header sibling when window is resized

Issue I am having trouble preventing a flexbox div from going under its sibling (header). I have the following HTML/CSS structure: HTML: <div class="application"> <header class="application-header">HEADER</header> <div class="application-content"> <div class="content"> <div class="content-header">TITLE</div> </div> </div> </div> CSS: .application { text-align: center;

March 14, 2022 Angular