gpt4 book ai didi

html - 具有相同水平位置的div

转载 作者:行者123 更新时间:2023-11-28 09:21:48 25 4
gpt4 key购买 nike

我有一个页面和两个 div。它们应该以相同的顶部位置出现,但它们以不同的垂直行出现。

一个带有不同的垂直位置,另一个以不同的垂直位置出现。

为什么他们水平不一样

以下是html

<%@ Page Language="C#" AutoEventWireup="true" CodeFile="Default2.aspx.cs"    Inherits="Default2" %>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">

<title></title>
</head>
<body>
<form id="f1" runat="server">
<div style="margin-left:100px; top:10px; border-width:10px; width:400px; border-style:solid;">
fawad
</div>
<div style="margin-left:600px; top:10px; border-width:10px; width:200px; border-style:solid">ali</div>
</form>

最佳答案

top CSS 样式并不像您想象的那样工作。您可能想改用 float,但是,如果您想要更简单的修复,请尝试以下操作:

<form id="f1" runat="server" style="position: relative">
<div style="top:10px; border-width:10px; width:400px; border-style:solid; position: absolute; left: 0">
fawad
</div>
<div style="top:10px; border-width:10px; width:200px; border-style:solid; position: absolute; left: 420px">ali</div>
</form>

CSS 盒模型非常复杂,但如果您经常从事 Web 工作,则非常值得学习。 float 的工作方式如下:

<div style="float: left">fawad</div>
<div>ali</div>

关于html - 具有相同水平位置的div,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/26062623/

25 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com