HTML DIV百分比宽度奇奇怪怪的间距产生了？

最近做站的时候要做个用户卡，顺着自己做的DEMO做，本来DEMO好好的结果放到测试站点里面变成这样...
DEMO运行的时候好好的啊，下面这图不是DEMO本体，是直接从站点上面扒下来的HTML代码然后在源文件里面加上CSS的效果
说白了是个Discuz论坛拉，但是为何会出现这种莫名其妙的间距问题，我去百度了很多也没找到。好像是显示模式引发的，但是在DEMO里面用同样的显示模式一点问题也没有。我之所以这样讲是因为当display模式设置成flex以后就没有了这些间距。
源码文件的话我发一下，用以替换discuz论坛里面的header_userstatus.htm还有header.htm在回复里面发吧，长度过了。

<!--{if $_G['uid']}-->

<div id="um">

	<div class="avt y" style="display:none;"><a href="home.php?mod=space&uid=$_G[uid]"><!--{avatar($_G[uid],small)}--></a></div>

	<div id="d_avt_menu">

		<div class="d_upt">

			<strong class="vwmy{if $_G['setting']['connect']['allow'] && $_G[member][conisbind]} qq{/if}"><a href="home.php?mod=space&uid=$_G[uid]" target="_blank" title="{lang visit_my_space}"class="showmenu" onmouseover="showMenu({'ctrlid':'myitem'});">{$_G[member][username]}</a></strong>

			<!--{if $_G['group']['allowinvisible']}-->

			<span id="loginstatus">

				<a id="loginstatusid" href="member.php?mod=switchstatus" title="{lang login_switch_invisible_mode}" onclick="ajaxget(this.href, 'loginstatus');return false;" class="xi2"></a>

			</span>

			<!--{/if}-->

			<div>

			<!--{hook/global_usernav_extra1}-->

			</div>

		</div>

		<div class="d_upm">

			<!--{hook/global_usernav_extra4}-->

			<div class="d_upmr d_upmr1">

				<!--{if $_G['uid']}-->

				<div><a href="home.php?mod=space&do=pm" id="pm_ntc" style="background-repeat: no-repeat; background-position: 0 50%;"><em class="prompt_news{if empty($_G[member][newpm])}_0{/if}"></em>{lang pm_center}</a></div>

				<div><a href="home.php?mod=follow&do=follower"><em class="prompt_follower{if empty($_G[member][newprompt_num][follower])}_0{/if}"></em><!--{lang notice_interactive_follower}-->{if $_G[member][newprompt_num][follower]}($_G[member][newprompt_num][follower]){/if}</a></div>

				<!--{if $_G[member][newprompt] && $_G[member][newprompt_num][follow]}-->

					<div><a href="home.php?mod=follow"><em class="prompt_concern"></em><!--{lang notice_interactive_follow}-->($_G[member][newprompt_num][follow])</a></div>

				<!--{/if}-->

				<!--{if $_G[member][newprompt]}-->

					<!--{loop $_G['member']['category_num'] $key $val}-->

						<div><a href="home.php?mod=space&do=notice&view=$key"><em class="notice_$key"></em><!--{echo lang('template', 'notice_'.$key)}-->(<span class="rq">$val</span>)</a></div>

					<!--{/loop}-->

				<!--{/if}-->

				<!--{if empty($_G['cookie']['ignore_notice'])}-->

					<div class="ignore_noticeli"><a href="javascript:;" onclick="setcookie('ignore_notice', 1);hideMenu('myprompt_menu')" title="{lang temporarily_to_remind}"><em class="ignore_notice"></em></a></div>

				<!--{/if}-->

				<!--{/if}-->

				<!--{if $_G['setting']['taskon'] && !empty($_G['cookie']['taskdoing_'.$_G['uid']])}--><div><a href="home.php?mod=task&item=doing" id="task_ntc" class="new">{lang task_doing}</a></div><!--{/if}-->

				<!--{if ($_G['group']['allowmanagearticle'] || $_G['group']['allowpostarticle'] || $_G['group']['allowdiy'] || getstatus($_G['member']['allowadmincp'], 4) || getstatus($_G['member']['allowadmincp'], 6) || getstatus($_G['member']['allowadmincp'], 2) || getstatus($_G['member']['allowadmincp'], 3))}-->

				<div><a href="portal.php?mod=portalcp"><!--{if $_G['setting']['portalstatus'] }-->{lang		portal_manage}<!--{else}-->{lang portal_block_manage}<!--{/if}--></a></div>

				<!--{/if}-->

				</div>

				<div class="d_upmr d_upmr2">

				<div><a href="javascript:;" id="myitem" class="showmenu" onmouseover="showMenu({'ctrlid':'myitem'});">{lang myitem}</a></div>

				<div><a href="home.php?mod=spacecp">{lang setup}</a></div>

					<!--{if $_G['uid'] && $_G['group']['radminid'] > 1}-->

				<div>

					<a href="forum.php?mod=modcp&fid=$_G[fid]" target="_blank">{lang forum_manager}</a>

				</div>

					<!--{/if}-->

					<!--{if $_G['uid'] && getstatus($_G['member']['allowadmincp'], 1)}-->

				<div>

					<a href="admin.php" target="_blank">{lang admincp}</a>

				</div>

				<!--{/if}-->

			</div>

			<!--{hook/global_usernav_extra2}-->

	</div>

	<div class="d_upb">

		<!--{hook/global_usernav_extra3}-->

		<div><a href="home.php?mod=spacecp&ac=credit&showcredit=1" id="extcreditmenu"{if !$_G[setting][bbclosed]} onmouseover="delayShow(this, showCreditmenu);" class="showmenu"{/if}>{lang credits}: $_G[member][credits]</a></div>

		<div><a href="home.php?mod=spacecp&ac=usergroup" id="g_upmine" class="showmenu" onmouseover="delayShow(this, showUpgradeinfo)">{lang usergroup}: $_G[group][grouptitle]<!--{if $_G[member]['freeze']}--><span class="xi1">({lang freeze})</span><!--{/if}--></a></div>

		<div><a href="member.php?mod=logging&action=logout&formhash={FORMHASH}">{lang logout}</a></div>

	</div>



</div>

<!--{elseif !empty($_G['cookie']['loginuser'])}-->

<p>

	<strong><a id="loginuser" class="noborder"><!--{echo dhtmlspecialchars($_G['cookie']['loginuser'])}--></a></strong>

	<a href="member.php?mod=logging&action=login" onclick="showWindow('login', this.href)">{lang activation}</a>

	<a href="member.php?mod=logging&action=logout&formhash={FORMHASH}">{lang logout}</a>

</p>

<!--{elseif !$_G[connectguest]}-->

<!--{template member/login_simple}-->

<!--{else}-->

<div id="um">

	<div class="avt y"><!--{avatar(0,small)}--></div>

	<p>

		<strong class="vwmy qq">{$_G[member][username]}</strong>

		<!--{hook/global_usernav_extra1}-->

		<span class="pipe">|</span><a href="member.php?mod=logging&action=logout&formhash={FORMHASH}">{lang logout}</a>

	</p>

	<p>

		<a href="home.php?mod=spacecp&ac=credit&showcredit=1">{lang credits}: 0</a>

		<span class="pipe">|</span>{lang usergroup}: $_G[group][grouptitle]

	</p>

</div>

<!--{/if}-->

<!--{if $_G['uid']}-->

	<script language=javascript>

		var panelstat = 0;

		var panelheight;

		var panelo;

		var davt;

		jQ(window).load(	

			function() {

				davt = document.getElementById('d_avt');

				panelo = document.getElementById('d_avt_menu');

				panelo.style.top=davt.offsetTop+davt.offsetHeight+"px";

				panelo.style.left=davt.offsetLeft+davt.offsetWidth-panelo.offsetWidth+"px";

				panelo.style.display='block';

				panelheight=document.getElementById('d_avt_menu').offsetHeight;

				panelo.style.height="0px"

				panelo.style.transition="all 0.2s linear";

			}

		)

		function changepanel()

		{

			if(panelstat==1){

				panelo.style.height="0px";

				panelo.style.boxShadow="0 0 0px rgba(0,0,0,0.3)"

				panelstat=0;

			}else{

				panelo.style.left=davt.offsetLeft+davt.offsetWidth-panelo.offsetWidth+"px";

				panelo.style.top=davt.offsetTop+davt.offsetHeight+"px";

				panelo.style.height=panelheight+"px";

				panelo.style.boxShadow="0 0 10px rgba(0,0,0,0.3)"

				panelstat=1;

			}

		}

	</script>

<!--{/if}-->

样式表的话把下面这些代码写到common.css里面，由于都是附加的样式所以可以直接写，随便写。

.d_upmr1 div {

    width: 25%;

}

.d_upmr div {

    display: inline-block;

    height: 50%;

    line-height: 60px;

    text-align: center;

}

.d_upmr2 div {

    width: 33.3%;

}

.d_upmr div a {

    text-decoration: none;

    color: white;

    text-shadow: 0 0 10px rgba(0,0,0,0.3);

    background-color: rgba(255,255,255,0.3);

    width: 100%;

    height: 100%;

    display: block;

    transition: 0.2s linear;

}

.d_upmr div a:hover {

    color: red;

    background-color: rgba(255,255,255,0.8);

    box-shadow: 0 0 10px rgba(0,0,0,0.3);

}

a {transition:0.2s linear;transition-property:color,background-color;}

a:hover {text-decoration:none;color:red;}



.d_upt {background:rgba(255,255,255,0.5);text-align:center;height:60px;line-height:60px;}

.d_upt .pipe {color:transparent;}

.d_upm {border-top:1px solid #CDCDCD;}

.d_upm em {display: none;}

.d_upb {background:rgba(255,255,255,0.5);padding:0 10px;text-align:center;}

.d_upb a:hover {color:	red !important;}

.d_upb a {color:black !important;}



#d_avt {border: 2px solid rgba(255,255,255,0.3);font-size: 15px;float: right;width: 48px;height: 48px;text-align: center;line-height: 44px;background: #FFF;box-shadow: 0 0 10px rgba(0,0,0,0.2);cursor: pointer;}

#d_avt a {color:rgba(20,50,255,0.5);height:48px;line-height:48px;width:	48px;text-align:center;display:block;}

#d_avt a:hover {color:red;}

#d_avt_menu {background:rgba(255,255,255,0.3);width:300px;box-shadow:0 0 10px rgba(0,0,0,0.3);overflow:hidden;left:auto;top:0px;position:fixed;display:none;}

感谢各位大大赏脸一读，如果能有大神来帮忙解决的话更好，这个问题实在太奇怪了我从来都没见过,不得已才来这里求助，第一次来这里如果有触犯什么规则或者什么不好的东西的话还请见谅！我会修改的！