两个并排 - 流体显示 [英] Two divs side by side - Fluid display

问题描述

我尝试并排放置两个div并使用以下CSS。

I am trying to place two divs side by side and using the following CSS for it.

#left {
  float: left;
  width: 65%;
  overflow: hidden;
}

#right {
  overflow: hidden;
}

HTML很简单，在封装器div中有两个左右div。 / p>

The HTML is simple, two left and right div in a wrapper div.

<div id="wrapper">
  <div id="left">Left side div</div>    
  <div id="right">Right side div</div>
</div>

我试过这么多次在Stackoverflow和其他网站上搜索一个更好的方法，但couldn找不到确切的帮助。

I have tried so many times to search for a better way on Stackoverflow and other sites too, But couldn't find the exact help.

所以，代码工作正常，第一眼。问题是这是，左div自动填充/边距随着增加宽度（％）。所以，在65％的宽度，左div有一些填充或边缘，并不完全对齐右div，我试图填充/边距0，但没有运气。第二，如果我放大页面，右边的div在左侧div下面滑动，它不像流畅的显示。

So, the code works fine in first glance. Problem is this, that the left div gets padding/margin automatically as I increase width in (%). So, at 65% width, the left div is having some padding or margin and is not perfectly aligned with the right div, I tried to padding/margin 0 but no luck. Secondly, If I zoom in the page, the right div slides below the left div, Its like not fluid display.

注意：对不起，我搜索了alot，这个问题已经被问过很多次，但是这些答案没有帮助我，我已经解释了我的情况是什么问题。

Note: I am sorry, I have searched alot, this question has been asked many times but those answers aren't helping me, I have explained what is problem in my case.

我希望有一个修复。

谢谢。

编辑：对不起，我的HTML问题，有两个盒子左侧和右侧，他们有填充％，所以左侧显示更多的填充，因为更大的宽度。对不起，上面的CSS工作完美，其流体显示和固定，对不起问问题....

Sorry, me HTML problem, There were two "box" divs in both left and right sides, They had padding in %, So left side showed more padding because of greater width. Sorry, The above CSS works perfect, its fluid display and fixed, Sorry for asking wrong question....

推荐答案

CSS我的当前网站。它工作完美！

Using this CSS for my current site. It works perfect!

#sides{
margin:0;
}
#left{
float:left;
width:75%;
overflow:hidden;
}
#right{
float:left;
width:25%;
overflow:hidden;
} 

这篇关于两个并排 - 流体显示的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！