在我用於uni的PC上，我的DIV的定位在Visual Studio 2015社區的DESIGN視圖和Internet Explorer/Chrome瀏覽器調試模式下均可正常工作。它看起來像這樣：CSS Visual Studio 2015 Float定位
在家裏，我使用Visual Studio的相同版本的像我一樣的統一。
這個想法是，應該有3行，每行有3個div。中間的div應該比左邊和右邊的寬，left_mid/right_mid top_mid/bot_mid DIV應該有邊框。
我把float:left上留下的div（LEFT_TOP，left_mid，left_bot），float:right上，我想就在中間的div（mid_top，mid_mid，mid_bot）右（RIGHT_TOP，right_mid，right_bot）和width:auto定位的div。
這是簡單的思想，它工作得很好。當我在家裏打開解決方案時，DIV看起來應該是在設計視圖中 - 不過在IE/Chrome調試時的瀏覽器視圖中 - 由於某種原因，它們沒有任何高度。過了一段時間，我發現由於某種原因，我不得不在FORM上放置高度和寬度，然後這些小傢伙又回到了他們的身高。 爲什麼？我不知道，不需要在FORM上設置高度和寬度。
但是，這並不能解決問題。他們的定位是不正確的 - 左頂DIV是它應該在的位置 - 在頁面的左上角。 Right_top DIV的位置也正確，它位於我的頁面的右上角。但是，由於某種未知的原因，中間DIV（mid_top）被放置在與left_top div相同的位置。
它適用於所有行 - mid_top/mid_mid/mid_bot div與left_top/left_mid/left_bot divs完全位於相同的位置（正如我只在瀏覽器調試視圖中所說的，在設計視圖中它看起來都很好） 。
這裏是我的問題的畫，使之更易於理解：
下面是代碼：
ASPX：
<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="WebForm1.aspx.cs" Inherits="WebApplication1.WebForm1" %>
<meta http-equiv="X-UA-Compatible" content="IE=8">
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title></title>
<link href="StyleSheet1.css" rel="stylesheet" type="text/css" />
</head>
<body>
<form id="form1" runat="server">
<div id="page">
<div id="left_side"></div>
<div id="right_side">
<div id="row1">
<div id="left_top"></div>
<div id="right_top"></div>
<div id="mid_top"></div>
</div>
<div id="row2">
<div id="left_mid"></div>
<div id="right_mid"></div>
<div id="mid_mid"></div>
</div>
<div id="row3">
<div id="left_bot"></div>
<div id="right_bot"></div>
<div id="mid_bot"></div>
</div>
</div>
</div>
</form>
</body>
</html>
和CSS樣式表：
body {
height:800px;
width:1200px;
}
#form1{
height:800px;
width:1200px;
}
#page{
height:800px;
width:1200px;
}
#left_side{
height:100%;
width:25%;
float:left;
}
#right_side{
height:100%;
width:75%;
float:right;
}
#row1{
height:33%;
width:100%;
}
#left_top{
height:100%;
width:25%;
float:left;
}
#right_top{
height:100%;
width:25%;
float:right;
}
#mid_top{
height:100%;
width:50%;
border:dashed;
border-width:1px;
}
#row2{
height:33%;
width:100%;
}
#left_mid{
height:100%;
width:25%;
float:left;
border:dashed;
border-width:1px;
}
#right_mid{
height:100%;
width:25%;
float:right;
border:dashed;
border-width:1px;
}
#mid_mid{
height:100%;
width:50%;
}
#row3{
height:33%;
width:100%;
}
#left_bot{
height:100%;
width:25%;
float:left;
}
#right_bot{
height:100%;
width:25%;
float:right;
}
#mid_bot{
height:100%;
width:50%;
border:dashed;
border-width:1px;
}
Left_side DIV在這裏是不必要的 - 我將在以後的項目中使用它。所有的行動都在right_side DIV。
正如你所看到的，我嘗試添加一些元標題，但我不完全知道它在做什麼，它也沒有改變任何東西。
我也嘗試玩像設置顯示：塊，顯示：內聯，顯示：內聯塊等，但無濟於事......我不知道爲什麼它不工作時，它只是工作罰款之前。
如何保持你的語言在一個成熟的水平？我編輯了你不必要的粗俗 - 在這裏沒有地方。沒有地方要求幫助或討論你的壓力水平（我也刪除了所有這些）。只是...問你的問題。 –
使用bootstrap css框架。如果您在移動設備中展示，佈局將永遠不會改變。從下面的鏈接學習引導。不要自殺，請你是我的兄弟！ http://getbootstrap.com/ –
乾杯兄弟！但是，我們不能在我們的代碼中使用JavaScript，所以我不能真正使用它。無論如何顯然自殺的一部分是誇張的，我不想冒犯任何使用我的語言的人 - 我習慣了人們在reddit上發佈的方式以及這是常態的網站，假設我應該調整我的帖子到更屬於這裏的正式水平。 –