Ggtcf

How does quantile regression compare to logistic regression with the variable split at the quantile?

Why can't I see bouncing of a switch on an oscilloscope?

Is it possible to do 50 km distance without any previous training?

Can an x86 CPU running in real mode be considered to be basically an 8086 CPU?

Malformed Address '10.10.21.08/24', must be X.X.X.X/NN or

Is it tax fraud for an individual to declare non-taxable revenue as taxable income? (US tax laws)

Why is consensus so controversial in Britain?

How can bays and straits be determined in a procedurally generated map?

Is it possible to run Internet Explorer on OS X El Capitan?

Can a Cauchy sequence converge for one metric while not converging for another?

Why is 150k or 200k jobs considered good when there's 300k+ births a month?

Approximately how much travel time was saved by the opening of the Suez Canal in 1869?

Accidentally leaked the solution to an assignment, what to do now? (I'm the prof)

Did Shadowfax go to Valinor?

tikz convert color string to hex value

Maximum likelihood parameters deviate from posterior distributions

Is it unprofessional to ask if a job posting on GlassDoor is real?

Why "Having chlorophyll without photosynthesis is actually very dangerous" and "like living with a bomb"?

Why are electrically insulating heatsinks so rare? Is it just cost?

Codimension of non-flat locus

Can you really stack all of this on an Opportunity Attack?

How can I make my BBEG immortal short of making them a Lich or Vampire?

Was any UN Security Council vote triple-vetoed?

What does it mean to describe someone as a butt steak?

Clearing space between two divs

Make a div fill the height of the remaining screen spaceHow to horizontally center a <div>?How do you keep parents of floated elements from collapsing?Space between two rows in a table?How to make div not larger than its contents?Div width 100% minus fixed amount of pixelsCreating a div element in jQueryHow to make a div 100% height of the browser window?How do I remove the space between inline-block elements?How do I add spacing between columns in Bootstrap?

.everyoneloves__top-leaderboard:empty,.everyoneloves__mid-leaderboard:empty,.everyoneloves__bot-mid-leaderboard:empty height:90px;width:728px;box-sizing:border-box;

0

Could anyone please help me with the following problem?
How can I clear the space between div "top" and div "middle"? This is just a portion of my HTML code. In the browser, I can see a white space between the two divs. How can get rid of the space?

<div class="container">
 <div class="top">

 </div>

 <div class="middle">

 </div>
</div>

html

share|improve this question

asked Mar 9 at 1:07

LeealpLeealp

33

• 
  
  
  

  
  

  
  
  
  
  
  

  
  
  what is the css properties for those classes, .container, .top and .middle?
  
  – mthrsj
  Mar 9 at 1:10
  

  
  
  
  


• 
  
  
  

  
  

  
  
  
  
  
  

  
  
  Please, have a look at the section on How to Ask a good question, if you posted a Minimal, Complete, and Verifiable example it would make it easier to find out what can be the problem, then we could give you better answers.
  
  – Raul Sauco
  Mar 9 at 1:19
  
  

  
  
  
  

add a comment | 

0

Could anyone please help me with the following problem?
How can I clear the space between div "top" and div "middle"? This is just a portion of my HTML code. In the browser, I can see a white space between the two divs. How can get rid of the space?

<div class="container">
 <div class="top">

 </div>

 <div class="middle">

 </div>
</div>

html

share|improve this question

asked Mar 9 at 1:07

LeealpLeealp

33

• 
  
  
  

  
  

  
  
  
  
  
  

  
  
  what is the css properties for those classes, .container, .top and .middle?
  
  – mthrsj
  Mar 9 at 1:10
  

  
  
  
  


• 
  
  
  

  
  

  
  
  
  
  
  

  
  
  Please, have a look at the section on How to Ask a good question, if you posted a Minimal, Complete, and Verifiable example it would make it easier to find out what can be the problem, then we could give you better answers.
  
  – Raul Sauco
  Mar 9 at 1:19
  
  

  
  
  
  

add a comment | 

Could anyone please help me with the following problem?
How can I clear the space between div "top" and div "middle"? This is just a portion of my HTML code. In the browser, I can see a white space between the two divs. How can get rid of the space?

<div class="container">
 <div class="top">

 </div>

 <div class="middle">

 </div>
</div>

html

share|improve this question

asked Mar 9 at 1:07

LeealpLeealp

33

<div class="container">
 <div class="top">

 </div>

 <div class="middle">

 </div>
</div>

share|improve this question

asked Mar 9 at 1:07

LeealpLeealp

33

share|improve this question

asked Mar 9 at 1:07

LeealpLeealp

33

asked Mar 9 at 1:07

LeealpLeealp

33

asked Mar 9 at 1:07

LeealpLeealp

33

3 Answers
3

active

oldest

votes

0

You can use flexbox in the container class to achieve this:

<style>
 .container 
 display: flex;
 flex-direction: column;
 

 .top 
 width: 100px;
 height: 50px;
 background-color: red;
 

 .middle 
 width: 100px;
 height: 50px;
 background-color: red;
 
</style>
<div class="container">
 <div class="top">
 <p>Top</p>
 </div>

 <div class="middle">
 <p>Middle</p>
 </div>
</div>

with flexbox

without flexbox

share|improve this answer

answered Mar 9 at 1:43

Merlin FejzuliMerlin Fejzuli

1697

add a comment | 

1

There is a solution I've used before but it's very hacky and usually means that somewhere else you're making a mistake (bad css, poor html markup, etc.)

If you give a font-size: 0; to the container element it will render the "space" between the divs at a font size of 0 which will close the gap.

However this can affect font sizes in the child elements within .container.

Like I said, you probably have CSS rules elsewhere that can be improved to prevent you from using this hack.

But this should remove the white space on the page that occurs from the whitespace in the gap.

.container 
 font-size: 0;

---

Edit:
Flex can usually help with responsive and fluid layouts that will prevent issues like these.

share|improve this answer

answered Mar 9 at 1:14

domdambrogiadomdambrogia

8111022

• 
  
  
  

  
  1
  

  
  
  
  
  
  

  
  
  thank you for your help. When I do font-size: 0, it works but everything disappears (pictures, paragraphs etc...)
  
  – Leealp
  Mar 9 at 1:55
  

  
  
  
  


• 
  
  
  

  
  1
  

  
  
  
  
  
  

  
  
  The second option with (display: flex and flex-direction: column;) is working very fine and I just have to do few adjustments. Thank you very much very. You're the bossman!
  
  – Leealp
  Mar 9 at 1:58
  
  

  
  
  
  

add a comment | 

0

"I can see a white space between the two divs."

Without all the code, or a screen shot, it's not obvious what this means.

If the whitespace is vertically separating the two divs, then you can reduce or eliminate the margins:

.container div margin: 0; 

That style addition would also reduce the whitespace between two horizontally separated divs.

But if you want to totally remove the whitespace, then remove the space from your source:

<div class="top">
 ...
</div><div class="middle"> <!-- change here -->
 ...
</div>

I.e. there is now no space between the "/div" and "div" tags.

share|improve this answer

answered Mar 9 at 1:29

Ray ButterworthRay Butterworth

15717

• 
  
  
  

  
  

  
  
  
  
  
  

  
  
  using .container divmargin: 0 will apply to all your code removing margin everywhere which is not a good idea. You'll have to go fix the margin everywhere it's been reset to 0. But the flex option above works the best.
  
  – Leealp
  Mar 9 at 2:08
  

  
  
  
  

add a comment | 

Your Answer

StackExchange.ifUsing("editor", function ()
StackExchange.using("externalEditor", function ()
StackExchange.using("snippets", function ()
StackExchange.snippets.init();
);
);
, "code-snippets");

StackExchange.ready(function()
var channelOptions =
tags: "".split(" "),
id: "1"
;
initTagRenderer("".split(" "), "".split(" "), channelOptions);

StackExchange.using("externalEditor", function()
// Have to fire editor after snippets, if snippets enabled
if (StackExchange.settings.snippets.snippetsEnabled)
StackExchange.using("snippets", function()
createEditor();
);

else
createEditor();

);

function createEditor()
StackExchange.prepareEditor(
heartbeatType: 'answer',
autoActivateHeartbeat: false,
convertImagesToLinks: true,
noModals: true,
showLowRepImageUploadWarning: true,
reputationToPostImages: 10,
bindNavPrevention: true,
postfix: "",
imageUploader:
brandingHtml: "Powered by u003ca class="icon-imgur-white" href="https://imgur.com/"u003eu003c/au003e",
contentPolicyHtml: "User contributions licensed under u003ca href="https://creativecommons.org/licenses/by-sa/3.0/"u003ecc by-sa 3.0 with attribution requiredu003c/au003e u003ca href="https://stackoverflow.com/legal/content-policy"u003e(content policy)u003c/au003e",
allowUrls: true
,
onDemand: true,
discardSelector: ".discard-answer"
,immediatelyShowMarkdownHelp:true
);



);

draft saved

draft discarded

Sign up or log in

StackExchange.ready(function ()
StackExchange.helpers.onClickDraftSave('#login-link');
);

Sign up using Google

Sign up using Facebook

Sign up using Email and Password

Post as a guest

Name

Email

Required, but never shown

StackExchange.ready(
function ()
StackExchange.openid.initPostLogin('.new-post-login', 'https%3a%2f%2fstackoverflow.com%2fquestions%2f55073012%2fclearing-space-between-two-divs%23new-answer', 'question_page');

);

Post as a guest

Name

Email

Required, but never shown

0

You can use flexbox in the container class to achieve this:

<style>
 .container 
 display: flex;
 flex-direction: column;
 

 .top 
 width: 100px;
 height: 50px;
 background-color: red;
 

 .middle 
 width: 100px;
 height: 50px;
 background-color: red;
 
</style>
<div class="container">
 <div class="top">
 <p>Top</p>
 </div>

 <div class="middle">
 <p>Middle</p>
 </div>
</div>

with flexbox

without flexbox

share|improve this answer

answered Mar 9 at 1:43

Merlin FejzuliMerlin Fejzuli

1697

add a comment | 

0

You can use flexbox in the container class to achieve this:

<style>
 .container 
 display: flex;
 flex-direction: column;
 

 .top 
 width: 100px;
 height: 50px;
 background-color: red;
 

 .middle 
 width: 100px;
 height: 50px;
 background-color: red;
 
</style>
<div class="container">
 <div class="top">
 <p>Top</p>
 </div>

 <div class="middle">
 <p>Middle</p>
 </div>
</div>

with flexbox

without flexbox

share|improve this answer

answered Mar 9 at 1:43

Merlin FejzuliMerlin Fejzuli

1697

add a comment | 

You can use flexbox in the container class to achieve this:

<style>
 .container 
 display: flex;
 flex-direction: column;
 

 .top 
 width: 100px;
 height: 50px;
 background-color: red;
 

 .middle 
 width: 100px;
 height: 50px;
 background-color: red;
 
</style>
<div class="container">
 <div class="top">
 <p>Top</p>
 </div>

 <div class="middle">
 <p>Middle</p>
 </div>
</div>

with flexbox

without flexbox

share|improve this answer

answered Mar 9 at 1:43

Merlin FejzuliMerlin Fejzuli

1697

<style>
 .container 
 display: flex;
 flex-direction: column;
 

 .top 
 width: 100px;
 height: 50px;
 background-color: red;
 

 .middle 
 width: 100px;
 height: 50px;
 background-color: red;
 
</style>
<div class="container">
 <div class="top">
 <p>Top</p>
 </div>

 <div class="middle">
 <p>Middle</p>
 </div>
</div>

share|improve this answer

answered Mar 9 at 1:43

Merlin FejzuliMerlin Fejzuli

1697

answered Mar 9 at 1:43

Merlin FejzuliMerlin Fejzuli

1697

answered Mar 9 at 1:43

Merlin FejzuliMerlin Fejzuli

1697

1

There is a solution I've used before but it's very hacky and usually means that somewhere else you're making a mistake (bad css, poor html markup, etc.)

If you give a font-size: 0; to the container element it will render the "space" between the divs at a font size of 0 which will close the gap.

However this can affect font sizes in the child elements within .container.

Like I said, you probably have CSS rules elsewhere that can be improved to prevent you from using this hack.

But this should remove the white space on the page that occurs from the whitespace in the gap.

.container 
 font-size: 0;

---

Edit:
Flex can usually help with responsive and fluid layouts that will prevent issues like these.

share|improve this answer

answered Mar 9 at 1:14

domdambrogiadomdambrogia

8111022

• 
  
  
  

  
  1
  

  
  
  
  
  
  

  
  
  thank you for your help. When I do font-size: 0, it works but everything disappears (pictures, paragraphs etc...)
  
  – Leealp
  Mar 9 at 1:55
  

  
  
  
  


• 
  
  
  

  
  1
  

  
  
  
  
  
  

  
  
  The second option with (display: flex and flex-direction: column;) is working very fine and I just have to do few adjustments. Thank you very much very. You're the bossman!
  
  – Leealp
  Mar 9 at 1:58
  
  

  
  
  
  

add a comment | 

1

There is a solution I've used before but it's very hacky and usually means that somewhere else you're making a mistake (bad css, poor html markup, etc.)

If you give a font-size: 0; to the container element it will render the "space" between the divs at a font size of 0 which will close the gap.

However this can affect font sizes in the child elements within .container.

Like I said, you probably have CSS rules elsewhere that can be improved to prevent you from using this hack.

But this should remove the white space on the page that occurs from the whitespace in the gap.

.container 
 font-size: 0;

---

Edit:
Flex can usually help with responsive and fluid layouts that will prevent issues like these.

share|improve this answer

answered Mar 9 at 1:14

domdambrogiadomdambrogia

8111022

• 
  
  
  

  
  1
  

  
  
  
  
  
  

  
  
  thank you for your help. When I do font-size: 0, it works but everything disappears (pictures, paragraphs etc...)
  
  – Leealp
  Mar 9 at 1:55
  

  
  
  
  


• 
  
  
  

  
  1
  

  
  
  
  
  
  

  
  
  The second option with (display: flex and flex-direction: column;) is working very fine and I just have to do few adjustments. Thank you very much very. You're the bossman!
  
  – Leealp
  Mar 9 at 1:58
  
  

  
  
  
  

add a comment | 

There is a solution I've used before but it's very hacky and usually means that somewhere else you're making a mistake (bad css, poor html markup, etc.)

If you give a font-size: 0; to the container element it will render the "space" between the divs at a font size of 0 which will close the gap.

However this can affect font sizes in the child elements within .container.

Like I said, you probably have CSS rules elsewhere that can be improved to prevent you from using this hack.

But this should remove the white space on the page that occurs from the whitespace in the gap.

.container 
 font-size: 0;

---

Edit:
Flex can usually help with responsive and fluid layouts that will prevent issues like these.

share|improve this answer

answered Mar 9 at 1:14

domdambrogiadomdambrogia

8111022

.container 
 font-size: 0;

share|improve this answer

answered Mar 9 at 1:14

domdambrogiadomdambrogia

8111022

answered Mar 9 at 1:14

domdambrogiadomdambrogia

8111022

answered Mar 9 at 1:14

domdambrogiadomdambrogia

8111022

0

"I can see a white space between the two divs."

Without all the code, or a screen shot, it's not obvious what this means.

If the whitespace is vertically separating the two divs, then you can reduce or eliminate the margins:

.container div margin: 0; 

That style addition would also reduce the whitespace between two horizontally separated divs.

But if you want to totally remove the whitespace, then remove the space from your source:

<div class="top">
 ...
</div><div class="middle"> <!-- change here -->
 ...
</div>

I.e. there is now no space between the "/div" and "div" tags.

share|improve this answer

answered Mar 9 at 1:29

Ray ButterworthRay Butterworth

15717

• 
  
  
  

  
  

  
  
  
  
  
  

  
  
  using .container divmargin: 0 will apply to all your code removing margin everywhere which is not a good idea. You'll have to go fix the margin everywhere it's been reset to 0. But the flex option above works the best.
  
  – Leealp
  Mar 9 at 2:08
  

  
  
  
  

add a comment | 

0

"I can see a white space between the two divs."

Without all the code, or a screen shot, it's not obvious what this means.

If the whitespace is vertically separating the two divs, then you can reduce or eliminate the margins:

.container div margin: 0; 

That style addition would also reduce the whitespace between two horizontally separated divs.

But if you want to totally remove the whitespace, then remove the space from your source:

<div class="top">
 ...
</div><div class="middle"> <!-- change here -->
 ...
</div>

I.e. there is now no space between the "/div" and "div" tags.

share|improve this answer

answered Mar 9 at 1:29

Ray ButterworthRay Butterworth

15717

• 
  
  
  

  
  

  
  
  
  
  
  

  
  
  using .container divmargin: 0 will apply to all your code removing margin everywhere which is not a good idea. You'll have to go fix the margin everywhere it's been reset to 0. But the flex option above works the best.
  
  – Leealp
  Mar 9 at 2:08
  

  
  
  
  

add a comment | 

"I can see a white space between the two divs."

Without all the code, or a screen shot, it's not obvious what this means.

If the whitespace is vertically separating the two divs, then you can reduce or eliminate the margins:

.container div margin: 0; 

That style addition would also reduce the whitespace between two horizontally separated divs.

But if you want to totally remove the whitespace, then remove the space from your source:

<div class="top">
 ...
</div><div class="middle"> <!-- change here -->
 ...
</div>

I.e. there is now no space between the "/div" and "div" tags.

share|improve this answer

answered Mar 9 at 1:29

Ray ButterworthRay Butterworth

15717

.container div margin: 0; 

<div class="top">
 ...
</div><div class="middle"> <!-- change here -->
 ...
</div>

share|improve this answer

answered Mar 9 at 1:29

Ray ButterworthRay Butterworth

15717

answered Mar 9 at 1:29

Ray ButterworthRay Butterworth

15717

answered Mar 9 at 1:29

Ray ButterworthRay Butterworth

15717