Let's make a new Post
Inline-block, what the fuck
Jul 1st 2016, 12:07 PM
I'm trying to get two inline-blocks to sit next to eachother but for fucks sake it's not working. I'm not completely braindead but I have no idea why this isn't working. Code is shit, made a new setup just to troubleshoot this so don't judge it. Please help me.

HTML:
Code:
<div class="box">
  <div class="child">first</div>
  <div class="child">what the fuck</div>
</div>


CSS:
Code:
.box {
display:block;
width:100%;
}
.child {
display:inline-block;
width:50%;
background:red;
}

What it looks like:
[Image: 78908c8109874346866da72189d78332.png]
Share this Post
24
May 2016
3 Comments
has marked this post as serious. Joking, trolling, and off-topic comments will be removed.
A moderator has turned off commenting for this post.
A moderator has pinned this post to the Hardware and Software category.
has marked this post as NSFW. Adult content is permitted.
Viewing page of
Share this Comment
24
May 2016
Also float is not an option.
Share this Comment
164
Feb 2015
Why isn't float an option? Just set [icode]overflow:hidden[/icode] on the parent
Share this Comment
entity#1
GamingHQ Lead Administrator
1,379
Dec 2014
Drop top BM's, I'm the man girlfriend
When the children are on new lines it creates a space between them which is what causes this. Add a comment between the children like this:

Code:
<div class="parent">
   <div class="child">
       ecks
   </div><!--
   --><div class="child">
       dee
   </div>
</div>
Doesn't require float.
1455 views