Tagged Questions
4
votes
3answers
43 views
Why does the div following a floated div overlap the floated one?
I have a floated left sidebar layout with breadcrumbs and main content area on the right.
If you Inspect Element on the breadcrumbsContainer (see jsFiddle), you can see that its left edge is all the ...
0
votes
1answer
51 views
Why do block elements go behind a float and inline go around?
I am finally starting to understand floats in CSS but I am stuck on one part.
I understand floating an element takes it out of the flow of the document so elements after it would render 'underneath' ...
0
votes
0answers
17 views
Float the nav to the right and keep it flush with the edge of the page on resize
I need the menu (book 1, book 2 etc) that is wrapped in the div class="nav" to float all the way right and stay aligned and sticky to the right side of the browser window no matter how big the ...
1
vote
1answer
26 views
Why is Susy giving my columns a 44.44444% width instead of 50%?
Cannot figure out why my columns are not 50% when no-gutters is included in the parameters?
SCSS:
$susy: (
global-box-sizing: border-box,
gutters: 1/4,
gutter-position: before
);
.columns {
...
0
votes
1answer
12 views
How to clear floated img (sidebar is floated too)
I need help with fiddle
I would like to clear nearest floated block, if it's possible.
It seems if there is some floating block on page and if I anywhere use clear, floated block will be cleared ...
0
votes
1answer
27 views
How to define an elements style using CSS to be on top of an other? Why in my case z-index isn't effective?
I have this style on an <img> tag.
position: absolute;
margin: -477px 0 0 581px;
z-index: 1000;
and near this element I have a div with this style:
position: relative;
margin: 100px 0 0 ...
1
vote
1answer
23 views
Easy CSS: Making column backgrounds line up
I know this will be easy for someone experienced in CSS. I made a mock-up of my code here to show what I have. I'm trying to get the background colors, pink and green, extend to the bottom of the ...
1
vote
3answers
40 views
Positioning absolute and relative elements with css
I tried to position html elements, but a failed badly. My html code is quiete simple:
<!DOCTYPE html>
<html>
<head>
<link rel="stylesheet" type="text/css" ...
-4
votes
1answer
25 views
Fixing sidebar on my project
i have problem to fix sidebar on RIGHT side of my project. you can look it here
so navigation and sidebar need to be fixed, and just main content to be scroling
it need to look like this :
#sidebar ...
-1
votes
2answers
31 views
centre a group of floated divs
I'm trying to centre a group of floated divs.
HTML
<div class="wrapper">
<div class="parent">
<div class="child"></div>
<div ...
0
votes
1answer
25 views
Do I really need css clear for a 2 column layout with header and footer?
I have read tutorial here http://www.smashingmagazine.com/2009/10/19/the-mystery-of-css-float-property/ and it says :
to resolve footer issue I would need to use css clear on footer :
#footer {
...
0
votes
5answers
31 views
css float 4 divs in a square order (float-left only 2° and 4° does not work)
I have 4 divs
<div id="first"></div>
<div id="second"></div>
<div id="third"></div>
<div id="fourth"></div>
and I need to align them in a "square" ...
0
votes
3answers
26 views
Header: Logo to the left, nav to the right. (Vertical aligned to the center)
I'm having trouble aligning my navigation to the right of the header. Searching on the web, I think the problem is because I'm aligned the items vertically to the center, and the float option isn't ...
0
votes
2answers
29 views
Div with overflow hidden, no work on chat invite image script
Please Help me! I have a problem.
please view the image: http://s15.postimg.org/wyb1fs7kr/duvida.png
I have a div with a chat icon status, but this same script that calls the icon status, also calls ...
-1
votes
2answers
34 views
How to make the div's appear inline in the following code?
How to make the following div's appear inline in the following html with a scroll
@ http://jsfiddle.net/hj2E6/5/
<div id="scrollable">
<div class="childDiv">
<div ...
-2
votes
1answer
28 views
Center Align Multiple DIV under single main DIV causing overlapping issue
I want to print multiple DIV one after another in single line. Also i need to center the content to the page.
I am able do this with float style but its not Centered to the page. I searched google , ...
2
votes
3answers
36 views
Having a link right after inline list with a fixed HTML structure
Hie everyone,
I have this HTML structure I can't change :
<div>
<ul>
<li>1</li>
<li>2</li>
<li>3</li>
<li>4</li>
...
0
votes
3answers
41 views
How can I center the following boxes using CSS [duplicate]
I am trying to center the boxes horizontally. Currently they are aligned to the left and when you resize the window they move responsively. I would still like to keep that functionality. I just want ...
0
votes
2answers
35 views
POP UP window to come from top?
I have a popup window coming in my web page on click of a button.
I want this popup window to transition from top to the center of the web page on the click of the button
can this be done using CSS?
...
0
votes
1answer
16 views
Set position of a div below that others without absolute positioning?
Please visit my website to see my problem: http://amrapps.ir/personal/.
How can i position the blue div below than other divs(the logo,and colorful navigation links) without absolute positioning? ...
0
votes
3answers
53 views
How to put a logo on the left top with float?
I want to have my logo (text logo, no image) on the left top in the navigation bar, but I can't make it.. I tried it with float:left and it dosen't work, I dont know why.
My site: ...
-1
votes
1answer
52 views
How to position a div within and at the bottom of a div, while maintaining text-wrapping [closed]
I have two div elements, one nested inside the other. I just want to set the position of the inner div to be in the bottom-right corner of the outer div. I tried to set the position, but I also want ...
0
votes
2answers
19 views
Cannot right align twitter bootstrap pagination widget when inside a panel
I have defined a panel, and inside of it I want to add a pagination right alined.
I tried with the text-align property, setting margin-left and margin-right to auto, but none of them seems to work. ...
1
vote
1answer
54 views
CSS: ellipsis with right add-on that should always be visible
I have 3 objects in a line - Text, Icon and Date.
First goes Text, then goes Icon (stuck to the end of the Text). And the Date is stuck to the right side of the line.
When Text is too long, I want ...
0
votes
0answers
53 views
What CSS code would make the left sidebar content float right?
EDIT: I'm not asking about alternative ways to solve this problem, although I appreciate the thoughts that have been presented so far. I'm looking for a way to make the left sidebar content float ...
1
vote
2answers
38 views
Bootstrap center floated divs
I'm trying to center a block of floated divs. I want that divs are always centered.
I created a fiddle:
http://jsfiddle.net/b6qev/1/
This is my code.
HTML
<div class="container">
...
0
votes
3answers
41 views
Place element on the right corner of a window
I would like to add a close button to a window in HTML, and I would like the button to float over the winodw like in this example : http://sandbox.scriptiny.com/tinybox2/ (the second example)
So I ...
0
votes
5answers
40 views
Side by Side <div> then regular <div>
I have been goaded into humility by HTML and CSS:
Trying to mimic the following:
This is my attempt:
<div>
<div style="width:800px;">
<div ...
0
votes
1answer
36 views
anchor float right of ul
<nav style="width:100%">
<ul>
<li><a href="####.html" style="border-left:1px solid #FFF;">****</a></li>
<li><a ...
1
vote
4answers
47 views
Clear floats without using a container
I've got the following grid:
http://jsfiddle.net/LPrwP/1/
<div class="container">
<article class="col33"></article>
<article class="col33"></article>
...
0
votes
3answers
59 views
Margin doesn't work when working with floats
I have 3 divs that stack on top of one another. All have the same width and height, e.g. 500px x 500px.
Top div float right. 2nd one margin-left and margin-right are set auto. 3rd one float left.
All ...
0
votes
3answers
44 views
css vertical align within float and height 100%
ive got some problem with my css styles:
I have different groups ( <div>'s ) that have subgroups displayed in ONE colum
or MULTIPLE ( max. 3) colums.
The problem i have is, that my ...
2
votes
3answers
25 views
2 column layout issue - stacking and floating
Probably a fairly basic solution to this, but I can't seem to figure it out... have set up a jsfiddle to demonstrate:
http://jsfiddle.net/AxKq8/1/
HTML
<div class="wrapper">
<div id="box-1" ...
0
votes
1answer
26 views
Make Float elements inline
I have some blocks in my footer and want to make them inline. But with display: block it's doesn't work because i also had float: right property. If i remove it, then all my footer design breaks. How ...
-1
votes
0answers
49 views
Span class around list
How can i span my arrow classes around the list so each appears of either side of the list items. The arrows did span over the class, however i needed to make the list horizontal so created the ...
1
vote
1answer
31 views
CSS variable width floating divs - prevent 2nd div wrapping / line-breaking below 1st div
I have a div with a variable sized thumbnail image to the left and another div to the right with info that I'd like keep aligned to the right without wrapping below the image div (leaving white space ...
-2
votes
2answers
53 views
HTML Inputs Not respecting CSS Height of containing div
I'm creating a user interface using the <input> tag, specifically with text and button.
My desired interface is to have two text boxes on top of each other, with a button the height of both text ...
1
vote
0answers
38 views
floating fluid and fixed width element
I want to have a 4 columns layout Panel Bar with the following conditions:
#c1, #c2 = with specific width
#c3 autofill with remaining width
#c4 auto width (e.g. increase / decrease width if more ...
2
votes
1answer
54 views
css animation on floated inline div's
I've long used this site to help me out with my CSS and HTML, but now I seem to have come up against a bug that I can't find an answer to:
I have a load of left floated div's in a parent div that is ...
0
votes
1answer
19 views
How do I display image flush with other images after a clear?
I've included a screen shot of what I currently have and how I want it fixed here: http://i.imgur.com/urAI4UF.png
Here is the simplified HTML code for my project (I have 19 images that I'm building ...
-1
votes
4answers
63 views
How can i override the margin: 0; padding: 0; border: 0; css styles
I was creating a table, but my issue is that table border is not working because it calls some other css.
Here is my FIDDLE
margin: 0;
padding: 0;
border: 0;
So how can i override the margin: ...
0
votes
2answers
53 views
Issues with CSS property 'float'
I'm trying to responsively position four div elements. My approach is to use the CSS float:left statement (jsFiddle code example).
CSS
.smart-box {
width: 28%;
min-width: 330px;
...
0
votes
0answers
27 views
Css alignment for button not working under IE
I have CSS code for button alignment. It's working in FF and hrome but not in IE.
Cancel button should come after change button not below change button. When I refresh the page it's positioned ...
0
votes
3answers
38 views
Floating table cells
How can I float td's within a table?
I have the following table:
<table align="center">
<tr>
<td>Huge IMAGE</td>
<td>VERY long TEXT</td>
...
1
vote
2answers
19 views
Floated div not taking full width
Why do floated divs don't take full width? Aren't they still block elements?
Here is an example http://jsfiddle.net/GKjC8/
html
<div id="a">a</div>
<div id="b">b</div>
css
...
0
votes
4answers
41 views
Floated Divs instead of a table to achieve layout
I am currently using a table with 2 rows, the top row has 3 columns, the bottom row has 2 columns.
can somebody please tell me how I would go about doing this same layout with floated divs? As I ...
1
vote
1answer
45 views
Vertical align content with float element + responsive layout
i have a component box layout with an image on left/right + content needs to be vertical align middle. And it needs to be work responsive to mobile in a layout of image on top + content at bottom. ...
0
votes
2answers
49 views
CSS float left and position elements
I have problem with float left , i use container widt 900px of size and inside have the elements for show 4 elements by line , the structure no give me problem , but if i use diferent height in one ...
1
vote
3answers
48 views
CSS trouble with float
I'm having some trouble floating some elements. I've reproduced an example here.
Basically I want Logout to appear on the right (just like the image appears on the left), but am having trouble doing ...
1
vote
2answers
33 views
HTML two sides of a span
I have a SPAN in a LI which looks likes this visually (the LI is 400px wide so there is lots of space):
[Name (age) ]
I want (age) to be on the right, Name on the left:
[Name ...