current community

your communities

more stack exchange communities

Stack Exchange
tour help
careers 2.0

Tagged Questions

1
vote
1answer
34 views

parent div shrinking smaller than width of child table

I have a wrapper div with only a fixed height. There are two child divs, both of which are floated to be horizontal. The right-hand child div contains a table. I expect the right-hand div to shrink to ...
1
vote
2answers
30 views

How to float: up/down from left/right between when breakpoint meets?

i need to create a layout two column container with the following criteria, please advice: On Desktop View: Content position left and will flow below the sidebar on the right when it's longer than ...
0
votes
1answer
47 views

Horizontal scroll in a parent div containing floated child divs

I have the following code: HTML <div id="parent"> <div class="child">2001</div> <div class="child">2O02</div> <div class="child">2003</div> ...
0
votes
0answers
31 views

change float display order on overflow-y

Can someone show me how to order the columns below (jsbin starter) so that as the screen gets smaller the last column is always displayed, the first column is hidden first, the second column is hidden ...
0
votes
0answers
18 views

Wrapping text around a float while dynamically hiding overflow

So, there's plenty of advice about how to get text to not wrap around a float by using overflow: hidden, but there's no advice for how to do the opposite. I want text to wrap around an image, and hide ...
0
votes
2answers
132 views

CSS float:left and overflow:visible cutting off text

I'm currently trying to make a color gradient in javascript with numerical values in some of the divs to represent as the scale. However, I've noticed with larger values, the numbers get cut off due ...
0
votes
0answers
51 views

CSS Floated Elements and overflow: hidden;

I noticed some strange behavior the other day and could not find the answer or reason why FF and Chrome behave differently on the following code (jsfiddle): http://jsfiddle.net/t6g2P/ HTML: <div ...
1
vote
2answers
50 views

Force clear flow for div container

I use this code on my test page http://spideradvices.blogspot.ro/2014/01/test-4.html to clear header-container float, but doesn't work. Can i force it somehow? #header-container{ position: relative ...
0
votes
2answers
49 views

How can I float a bunch of divs and still get overflow?

Here is my jsfiddle showing my attempt: HTML: <div id="container"> <div class="box"></div> <div class="box"></div> <div class="box"></div> ...
0
votes
1answer
36 views

How to make this rotator have dynamic height based on content?

Please go to: http://jsfiddle.net/6zFt5/ As you can see, this rotator doesn't work without specifying a FIXED HEIGHT in line 6 of the CSS. I need this widget to dynamically adapt its height based on ...
1
vote
1answer
166 views

Why overflow:hidden expands parent element (containing floated child elements)?

In short: Basically, I just want to know why overfow:hidden explands the container containing a floated item. Shouldnt it hide the overflowing element like in this image ...
0
votes
0answers
55 views

CSS 2.1 spec: rationale for not collapsing margins of parent (when parent is float or has overflow other than visible)

The CSS 2.1 specification, section 8.3.1 on collapsing margins states: Margins of elements that establish new block formatting contexts (such as floats and elements with 'overflow' other than ...
0
votes
0answers
41 views

Is it possible to make a “block formatting context” with the floating div written in second place?

Having read carefully the article about "block formatting context" (BFC) I still have one basic question which is whether is possible or not to create a BFC, writing in first place the "overflow: ...
0
votes
0answers
88 views

Extra space after percentage based image in floated div

I have a structure of many divs, where each has one image inside it... this all is wrapper inside one big container div. The whole thing is percentage based and the container div should be scrollable. ...
0
votes
2answers
46 views

How to float blocks of undetermined width

I am having problems floating multiple DIVs, allowing them to bust out of acontaining div. Please see my code below as an example. <!DOCTYPE HTML> <html lang="en-GB"> <head> ...
0
votes
1answer
197 views

Text Overflow Hidden Breaks Float

I need my text to wrap my image which works fine until I set the text overflow the hidden. The reason I need to set it to hidden is because it's going to be half hidden at first. I tried switching ...
1
vote
0answers
349 views

Overflow: hidden does not work with display: inline-block in Opera 12 (Presto)

See this demo: http://codepen.io/vobpler/pen/GHDCs It's pretty simple, a button with two elements inside. There's a .text element which holds the text shown in the default state, then there's a ...
2
votes
1answer
229 views

3 Float Divs with overflow content to next div - html & css

I have 3 div's which is floated left, with a continuous content and fixed height, then overflowed content from the first div should be shifted to 2nd div and other overflowed content of 2nd div must ...
1
vote
2answers
228 views

Float images into overflow without wrapper div

I got some images into a div. <div> <img /> <img /> <img /> <img /> </div> All images are set to the same height of 50px. The width is set to auto. ...
0
votes
1answer
2k views

Floated div 100% height of parent inline-block div

I am making a simple slideshow and I have got the javascript working very easily. However the layout is not going as well. The current image is display in big with a fixed width of 80% and the height ...
2
votes
1answer
502 views

multiple floated divs-overflow hidden, partial view

Here's the set up: I have a 100% width div that allows for the input of multiple images (this is in wordpress). I have a class set up that floats those images left. The overflow is hidden, but I want ...
0
votes
3answers
354 views

Footer menu goes top of main container

I have three main divs , they are header,main-container and footer. CSS for the divs are #main_container { width:950px; margin:0 auto; } #header { background:#f4f8f9; } #footer { ...
0
votes
1answer
277 views

How to make DIVs flow to the left in a x-scrollable pane with CSS?

I want to create a x-scrollable panel of specific height and width where DIVs should be positioned in a row to the left insted of to the bottom (see this example: http://jsbin.com/ohahac/1/edit). I ...
6
votes
4answers
2k views

Firefox unexpected line break using floats & overflow hidden

I have a container div that holds two items: a .button and a .box with text inside. .button comes first and is floated right. .box has no float [this is a constraint - I can't float it left due to ...
3
votes
1answer
505 views

Chrome: overflow:auto + margin:auto fails to layout correctly sometimes

I'm trying to layout a page which has anchor elements that I would like on a new line and centered. However these blocks are inside of <p> elements which are beside floating images. Right: ...
0
votes
2answers
866 views

Content goes outside div

As the title implies my problem is that the content doesn't stay inside the main container (no floats are used). Yes, I know there are a lot of questions regarding this matter here on Stack, though ...
1
vote
1answer
1k views

Prevent floating elements from wrapping around (show scroll bar instead)

How do I make a div tag's elements not wrap around and instead extend beyond the available space on the page? For example, I have: <div class="container"> <div class="row"> <div ...
0
votes
5answers
3k views

child div outside the parent

I am currently designing a website . But in one of my parent div box_t,the child divs box_t1 and box_t2 goes outside the box_t. My HTML: <div id="main_container"> <div ...
0
votes
3answers
2k views

child div goes outside parent div

Currently I am designing a website using CSS and HTML etc. But I have faced a problem there : my child div goes outside the parent div when I add floating to the child. The site resides here my web ...
25
votes
1answer
15k views

Fixed width div on left, fill remaining width div on right

I want a div with a fixed width image on the left and a variable width div with a background color, which should extend its width 100% on my device. I can't stop the second div from overflowing my ...
0
votes
2answers
312 views

creating gallery- thumbnails on left, main image on right- not aligned on top despite floats & clear:both

JSFiddle I'm creating an image gallery that, ideally, should have a column of thumbnails on the left with a larger image on the right with both sections aligned along the top vertical axis. To do ...
2
votes
3answers
4k views

Floating div not displaying background color when i am not using overflow?

HTML: <div id="wrapper"> <div id="content"> <div id="slider"></div> <div id="left"></div> <div id="right"></div> ...
1
vote
1answer
230 views

forcing overflow-x using percentage and float

I have a small structure of <li> inside a container and what i'm trying to make is to force the overflow-x appear instead of overflow-y, but i can't achieve this, i presume it is beacuse of ...
0
votes
1answer
171 views

Make floats flow over instead of dropping below eachother

I've got a number of div's with float:left;, of course they show up next to eachother but except for the floating div's wich don't fit in the wrapper div anymore. I need the divs to stay next to ...
0
votes
3answers
1k views

Auto-width a child div with a parent with fixed width and overflow: hidden

My problem is a bit difficult to explain. I would like a div to stretch so all of his floated childs stays on the same line. The problem is that the parent of the container has a fixed width and his ...
0
votes
2answers
389 views

Container div and overflow issues

OK, so I have an internal div that is designed to contain text, images, etc. The images are floated in this instance. After the internal div is a footer, which is my problem. No matter what I try, the ...
0
votes
0answers
146 views

Webkit related bug concerning nested floats and clearing

I have a fairly complex liquid layout with header, sticky footer, right sidebar and two columns in the content area. When I want to clear the two columns, the clear-statement also clears the right ...
0
votes
2answers
416 views

Force list items in div to float once div height is reached

I have a div with a fixed height and inside a dynamic unordered list. Currently the list items overflow the div. What needs to happen is to float the list items so that they do not overflow the div.
0
votes
2answers
67 views

one line placing inside overflow

I try to make a slider but have trouble, with placing all my div tags in one line. How do I do that? And how to do auto-width for #slider_content? <div style="width: 100px; height: 20px; ...
0
votes
1answer
100 views

clearing float height

http://jsfiddle.net/yN2Ky/2/show/ form page: http://jsfiddle.net/wbRBj/2/ The problem is that content of mainarea changes on the fly so overflow:hidden; on that contentarea doesn't work. I want... ...
0
votes
5answers
711 views

Div floating side by side with overflow?

I have a div wrapper, and inside it, i want divs to be side by side. I want the wrapper side to be fixed, so that as more divs are added, they overflow horizontally!! Also, I want the wrapper width ...
0
votes
1answer
101 views

prevent container from jumping

I'm having a serious brain fart- really an off day. I appreciate the accommodation. I have two containers, each floated left, and when the window is resized below the width of them, the second ...
1
vote
1answer
237 views

CSS overflow issue in Firefox

I have a table coded as follows; <table id="c_month_tbl" cellspacing="0" cellpadding="0" border="0" > <tbody> <tr> <td valign="top" class="weekend_days"> <div ...
0
votes
2answers
433 views

Stop div width from pushing it out of place

I've got 2 divs side by side. One has a fixed with of 150px (sidebar) and one adjusts to the remaining with of the parent div. <div style="margin:0 20%"> <div ...
9
votes
3answers
9k views

How to place two divs side by side where one sized to fit and other takes up remaining space?

This should be easy... why is this not easy? I am looking to have 2 divs side by side, where one div will auto size to the content inside and the second div will simply fill the remaining width. I ...
1
vote
2answers
1k views

Floating elements right avoiding scrollbars

Im trying to float an element right outside of the main page content and want to avoid the horizontal scroll bar from cutting it off Example http://www.warface.co.uk/clients/warface.co.uk/test I've ...
2
votes
5answers
397 views

Css - Don't want elements below my floated element

I have a floated div with "sidebar" text. Its parent container has text as well. I don't want to have text below my floated "sidebar" div: How can I fix this? <div id="parent"> <div ...
6
votes
4answers
5k views

HTML, overflow:scroll, and float

I have a div that encapsulates many unordered lists (ul). I have each ul set to "float:left". And I also have the parent div that contains them set to "overflow-x:scroll". What's happening is the ...
9
votes
5answers
24k views

Stop wrapping contained divs? [duplicate]

I currently have a setup of divs within a container div, as follows: <div id="container"> <div id="element"> Element 1 content </div> <div id="element"> Element 2 ...
0
votes
3answers
780 views

Floating elements left in an overflow wrapper set to hidden

I have a scenario where I need to show only six images at a time on my page. When you click on the next button, these six images will slide out and the next six images will slide in. Here is my html ...

1 2