aspx网页标题定位 [英] aspx Web Page heading positioning
问题描述
我的本地服务器网页中的标题定位似乎有问题。
以下是问题所在：
http://i622.photobucket.com/albums/tt301/kidown/HomeScreen.jpg
这里是我目前拥有的代码。
at site.master页面
<％@ Master 语言 = C＃ AutoEventWireup = true CodeBehind = Site.master.cs 继承 = Project_Thesis.SiteMaster ％>
< ！DOCTYPE html PUBLIC - // W3C // DTD XHTML 1.0 < span class =code-attribute>严格// EN http：//www.w3 .org / TR / xhtml1 / DTD / xhtml1-strict.dtd >
< html xmlns = http://www.w3.org/1999/xhtml >
< head runat = server >
<％ - < link href = 〜/ Styles / Site.css rel = < span class =code-string> stylesheet type = text / css /> - ％>
< asp：ContentPlaceHolder ID = HeadContent runat = server >
< / asp：ContentPlaceHolder >
< meta http-equiv = content-type content = text / html; charset = utf-8 / > ;
< title > 项目论文V2.0 < / title >
< meta name = Carlos Buhagiar content = / >
< link < span class =code-attribute> href = style.css rel = stylesheet type = text / css media = screen / >
< / head >
< body >
<跨度lass =code-keyword>< div id = header >
< h1 > < a href = ＃ < span class =code-keyword>> 项目论文2.0 < / a > < / h1 >
< h2 > 作者：Carlos Buhagiar < / h2 >
< / div >
< div id = 菜单 >
< ul >
< li > < a href = Home.aspx > 主页< span class =code-keyword>< / a > < / li >
< span class =code-keyword>< li > < a href = Results.aspx > 搜索< / a > ; < / li >
< li > < a < span class =code-attribute> href = Results.aspx > 当前图书数据库< / a < span class =code-keyword>> < / li >
< li > < a href = ＃ > < / a > < / li >
< li > < a href = ＃ > < / a > < / li >
< / ul >
< / div >
< hr / >
< div 样式 = 清除：两者; > & nbsp; < / div >
<！ - end #page - >
< hr / >
< div class = main >
< asp：ContentPlaceHolder < span class =code-attribute> ID = MainContent runat = 服务器 >
< / asp：ContentPlaceHolder >
< < span class =code-leadattribute> / div >
< div class = clear >
< / div >
< span class =code-keyword>< div id = footer >
< p > （c）2014 Project V2.0。< / p >
< p <从< href = < span class =code-keyword> http://www.freecsstemplates.org/ rel = nofollow > FreeCSSTemplates.org < / a > < / p >
< / div >
< / body >
< / html < span class =code-keyword>>
在家里。 aspx页面
<％@ Page 标题 = 主页 语言 = C＃ MasterPageFile = 〜/ Site.master AutoEventWireup = true
CodeBehind = Home.aspx.cs 继承 = Project_Thesis._Default ％>
< asp：Content ID = HeaderContent runat = server ContentPlaceHolderID < span class =code-keyword> = HeadContent >
< / asp：Content >
< asp：Content ID = BodyContent < span class =code-attribute> runat = 服务器 ContentPlaceHolderID = 主要内容 >
< div id = home >
< div id = content >
< div class = 发布 >
< h2 < span class =code-attribute> class = title > < a > 简介项目V2.0 < / a > < / h2 >
< div class = 条目 >
< p > 欢迎使用我的图书搜索项目V2.0 < / p >
< p > 要搜索图书，请点击顶部的搜索 screen。< / p >
< p > 享受和快乐搜索！ ：）< / p >
< / div >
<！ - < p class = meta>< span class =byline>发布者< a href =＃>某人< / a>在2007年12月22日< / span> < a href =＃class =comments> 18条评论< / a>< / p> - >
< / div >
< / div >
< / div >
< / asp：Content >
当我尝试移动位置时使用设计视图的东西，它不让我。每行只有一件事，甚至不能在相同的行中做出奇怪的空间。
有时我也会在未启用直接浏览时收到错误。关于如何启用它的任何想法？
这里是模板的样式CSS：
< pre lang =csslinecount =true> 1 / *
2 免费CSS模板设计
3 http：// www.freecsstemplates.org
4 根据知识共享署名2.5许可证免费发布
5 * /
6
7 * {
8 margin ： 0;
9 padding ： 0;
10 }
11
12 body {
13 背景 ： ＃000000 url（images / img01.gif）repeat-x;
14 font-family ： Trebuchet MS，Arial，Helvetica，sans-serif;
15 font-size ： 13px;
16 颜色 ： ＃999999;
17 }
18
19 h1 ， h2 ， h3 {
20 }
21
22 h1 {
23 font-size ： 3em;
24 }
25
26 h2 {
27 letter-spacing ： -1 px;
28 font-size ： 2em;
29 }
30
31 h3 {
32 font-size ： 1em;
33 }
34
35 p ， ul ， ol {
36 margin -top ： 1.8em;
38 }
39
40 ul ， ol {
41 margin-left ： 3em;
42 }
43
44 blockquote {
45 margin-left ： 3em;
46 margin-right ： 3em;
47 }
48
49 a {
50 颜色 ： #CCCCCC;
51 }
52
53 a：悬停 {
54 text-decoration ： none;
55 color ： #FFFFFF;
56 }
57
58 hr {
59 display ： none;
60 }
61
62 / * 标题* /
63
64 ＃ header {
65 width ： 960px;
66 heig ht ： 80px;
67 margin ： 0 auto;
68 background ： url（images / img02.jpg）;
69 }
70
71 ＃ header h1 ，＃ header h2 {
72 float ： left;
73 margin ： 0;
74 text-transform ： 大写;
75 颜色 ： #FFFFFF;
76 }
77
78 #header h1 {
79 padding: 30px 0 0 20px;
80 font-size: 3em;
81 }
82
83 #header h2 {
84 padding: 47px 0 0 8px;
85 font-size: 1.8em;
86 font-style: italic;
87 }
88
89 #header
90 text-decoration: none;
91 color: #FFFFFF;
92 }
93
94 /* Menu */
95
96 #menu {
97 width: 960px;
98 height: 51px;
99 margin: 0 auto;
100 background: url(images/img03.jpg);
101 }
102
103 #menu ul {
104 margin: 0;
105 padding: 0;
106 list-style: none;
107 line-height: normal;
108 }
109
110 #menu li {
111 float: left;
112 padding: 12px 10px 0 20px;
1 13 }
114
115 #menu a {
116 text-decoration: none;
117 letter-spacing: -1px;
118 font-size: 1.2em;
119 font-weight: bold;
120 }
121 $b$ b 122 #menu a:hover {
123 text-decoration: underline;
124 }
125
126 /* Page */
127
128 #page {
129 width: 920px;
130 margin: 0 auto;
131 padding: 30px 20px 20px 20px;
132 background: url(images/img04.jpg) no-repeat;
133 }
134
135 /* Content */
136
137 #content {
138 float: left;
139 width: 605px;
140 }
141
142 .post {
143 margin-bottom: 40px;
144 }
145
146 .post .title {
147 border-bottom: 1px solid #454545;
148 }
149
150 .post .title a {
151 text-decoration: none;
152 }
153
154 .post .entry {
155 padding: 0 20px;
156 }
157
158 .post .meta {
159 height: 20px;
160 padding: 15px 20px;
161 background: url(images/img05.gif) no-repeat;
162 line-height: normal;
163 }
164
165 .post .meta a {
166 text-decoration: none;
167 font-weight: bold;
168 }
169
170 .post .meta a:hover {
171 text-decoration: underline;
172 }
173
174 .post .meta .byline {
175 float: left;
176 }
177
178 .post .meta .comments {
179 float: right;
180 }
181
182 /* Sidebar */
183
184 #sidebar {
185 float: right;
186 width: 295px;
187 }
188
189 #sidebar ul {
190 margin: 0;
191 padding: 0;
192 list-style: none;
193 }
194
195 #sidebar li {
196 }
197
198 #sidebar li ul {
199 padding: 0 0 20px 20px;
200 list-styl e: square inside;
201 }
202
203 #sidebar h2 {
204 height: 50px;
205 padding: 13px 20px 0 20px;
206 background: url(images/img06.gif) no-repeat;
207 font-size: 1.6em;
208 }
209
210 /* Search */
211
212 #search {
213 padding: 20px;
214 text-align: center;
215 }
216
217 #search input {
218 margin-bottom: 10px;
219 padding: 3px 5px;
220 background: #1F1F1F url(images/img06.gif) no-repeat center center;
221 border: 1px solid #454545;
222 font: bold 1.2em \"Trebuchet MS\", Arial, Helvetica, sans-serif;
223 color: #FFFFFF;
224 }
225
226 #search #s {
227 width: 80%;
228 background: #1F1F1F;
229 }
230
231 /* Calendar */
232
233 #calendar {
234 padding-bottom: 20px;
235 }
236
237 #calendar table, #calendar caption {
238 width: 80%;
239 margin: 0 auto;
240 text-align: center;
241 }
242
243 #calendar caption {
244 text-transform: uppercase;
245 letter-spacing: .25em;
246 font-weight: bold;
247 }
2 48
249 #calendar thead th {
250 background: #333333;
251 }
252
253 #calendar tbody td {
254 background: #111111;
255 }
256
257 #calendar a {
258 text-decoration: none;
259 font-weight: bold;
260 }
261
262 #calendar a:hover {
263 text-decoration: underline;
264 }
265
266 /* Footer */
267
268 #footer {
269 width: 960px;
270 margin: 0 auto;
271 padding: 20px 0;
272 background: url(images/img07.gif) no-repeat;
273 }
274
275 #footer p {
276 margin: 0;
277 line-height: normal;
278 text-align: center;
279 }
I found another CSS called site.css, here are the contents
/* DEFAULTS
-------------------------------------------------- --------*/
body
{
background: #b6b7bc;
font-size: .80em;
font-family: \"Helvetica Neue\", \"Lucida Grande\", \"Segoe UI\", Arial, Helvetica, Verdana, sans-serif;
margin: 0px;
padding: 0px;
color: #696969;
}
a:link, a:visited
{
color: #034af3;
}
a:hover
{
color: #1d60ff;
text-decoration: none;
}
a:active
{
color: #034af3;
}
p
{
margin-bottom: 10px;
line-height: 1.6em;
}
/* HEADINGS
----------------------------------------------------------*/
h1, h2, h3, h4, h5, h6
{
font-size: 1.5em;
color: #666666;
font-variant: small-caps;
text-transform: none;
font-weight: 200;
margin-bottom: 0px;
}
h1
{
font-size: 1.6em;
padding-bottom: 0px;
margin-bottom: 0px;
}
h2
{
font-size: 1.5em;
font-weight: 600;
}
h3
{
font-size: 1.2em;
}
h4
{
font-size: 1.1em;
}
h5, h6
{
font-size: 1em;
}
/* this rule styles <h1> and <h2> tags that are the
first child of the left and right table columns */
.rightColumn > h1, .rightColumn > h2, .leftColumn > h1, .leftColumn > h2
{
margin-top: 0px;
}
/* PRIMARY LAYOUT ELEMENTS
----------------------------------------------------------*/
.page
{
width: 960px;
background-color: #fff;
margin: 20px auto 0px auto;
border: 1px solid #496077;
}
.header
{
position: relative;
margin: 0px;
padding: 0px;
background: #4b6c9e;
width: 100%;
}
.header h1
{
font-weight: 700;
margin: 0px;
padding: 0px 0px 0px 20px;
color: #f9f9f9;
border: none;
line-height: 2em;
font-size: 2em;
}
.main
{
padding: 0px 12px;
margin: 12px 8px 8px 8px;
min-height: 420px;
}
.leftCol
{
padding: 6px 0px ;
margin: 12px 8px 8px 8px;
width: 200px;
min-height: 200px;
}
.footer
{
color: #4e5766;
padding: 8px 0px 0px 0px;
margin: 0px auto;
text-align: cen ter;
line-height: normal;
}
/* TAB MENU
----------------------------------------------------------*/
div.hideSkiplink
{
background-color:#3a4f63;
width:100%;
}
div.menu
{
padding: 4px 0px 4px 8px;
}
d iv.menu ul
{
list-style: none;
margin: 0px;
padding: 0px;
width: auto;
}
div.menu ul li a, div.menu ul li a:visited
{
background-color: #465c71;
border: 1px #4e667d solid;
color: #dde4ec;
display: block;
line-height: 1.35em;
padding: 4px 20px;
text-decoration: none;
white-space: nowrap;
}
div.menu ul li a:hover
{
background-color: #bfcbd6;
color: #465c71;
text-decoration: none;
}
div.menu ul li a:active
{
background-color: #465c71;
color: #cfdbe6;
text-decoration: none;
}
/* FORM ELEMENTS
----------------------------------------------------------*/
fieldset
{
margin: 1em 0px;
padding: 1em;
borde r: 1px solid #ccc;
}
fieldset p
{
margin: 2px 12px 10px 10px;
}
fieldset.login label, fieldset.register label, fieldset.changePassword label
{
display: block;
}
fieldse t label.inline
{
display: inline;
}
legend
{
font-size: 1.1em;
font-weight: 600;
padding: 2px 4px 8px 4px;
}
input.textEntry
{
width: 320px;
bo rder: 1px solid #ccc;
}
input.passwordEntry
{
width: 320px;
border: 1px solid #ccc;
}
div.accountInfo
{
width: 42%;
}
/* MISC
----------------------------------------------------------*/
.clear
{
clear : both;
}
.title
{
display: block;
float: left;
text-align: left;
width: auto;
}
.loginDisplay
{
font-size: 1.1em;
display: block;
text-align: right;
padding: 10px;
color: White;
}
.loginDisplay a:link
{
color: white;
}
.loginDisplay a:visited
{
color: white;
}
.loginDisplay a:hover
{
color: white;
}
.failureNotification
{
font-size: 1.2em;
color: Red;
}
.bold
{
font-weight: bold;
}
.submitButton
{
text-align: right;
padding-right: 10px;
}
Thanks!!
My response is about the first CSS you posted...
In the rule .footer add clear:both; to put the footer under main content.
See line 268 in the first CSS and change like this:
#footer {
clear: both;
width: 960px;
margin: 0 auto;
padding: 20px 0;
background: url(images/img07.gif) no-repeat;
}
Hi, try to use div elements to arrange controls in your page..
Replace your particular design part with fallowing & make modifications as per your requirement..If possible after getting your proper design try to remove inline styles for div to centralized css file .希望对你有帮助！ :)
<div style=\"height: 200px\">
<div style=\"float: left; width: 40%\">
<p>
<asp:label id=\"lblBookTitle\" runat=\"server\" text=\"Book Title\" ></asp:label>
:</p>
<p>
<asp:textbox id=\"txtBookTitle\" runat=\"server\" ></asp:textbox>
</p>
<p>
<asp:label id=\"lblISBNNo\" runat=\"server\" text=\"ISBN Number :\" ></asp:label>
</p>
<p>
<asp:textbox id=\"TXtISBNNo\" runat=\"server\" ></asp:textbox>
</p>
<p>
<asp:button id=\"btnSearch\" runat=\"server\" text=\"Search\" />
</p>
</div>
<div style=\"float: left; width: 50%\">
<p>
<asp:image id=\"Image1\" runat=\"server\" imageurl=\"http://i622.photobucket.com/albums/tt301/kidown/backgroundpic.jpg\"
Height=\"150px\" Width=\"120px\" />
</asp:image></p>
</div>
</div>
Check for all css classes & also attributes which are uncommon.Check if there is any online reference in your site for css,jquery or jscript. Though this problem persists with default template also,you can remove it . ：）
Hi, I seem to have a problem regarding the positioning of the heading in my local server web pages.
The following is the problem:
http://i622.photobucket.com/albums/tt301/kidown/HomeScreen.jpg
here is the code I currently have.
at site.master page
<%@ Master Language="C#" AutoEventWireup="true" CodeBehind="Site.master.cs" Inherits="Project_Thesis.SiteMaster" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<%-- <link href="~/Styles/Site.css" rel="stylesheet" type="text/css" />--%>
<asp:ContentPlaceHolder ID="HeadContent" runat="server">
</asp:ContentPlaceHolder>
<meta http-equiv="content-type" content="text/html; charset=utf-8" />
<title>Project Thesis V2.0</title>
<meta name="Carlos Buhagiar" content="" />
<link href="style.css" rel="stylesheet" type="text/css" media="screen" />
</head>
<body>
<div id="header">
<h1><a href="#">Project Thesis 2.0</a></h1>
<h2>By Carlos Buhagiar</h2>
</div>
<div id="menu">
<ul>
<li><a href="Home.aspx">Home</a></li>
<li><a href="Results.aspx">Search</a></li>
<li><a href="Results.aspx">Current Book Database</a></li>
<li><a href="#"></a></li>
<li><a href="#"></a></li>
</ul>
</div>
<hr />
<div style="clear: both;"> </div>
<!-- end #page -->
<hr />
<div class="main">
<asp:ContentPlaceHolder ID="MainContent" runat="server">
</asp:ContentPlaceHolder>
</div>
<div class="clear">
</div>
<div id="footer">
<p>(c) 2014 Project V2.0.</p>
<p>Design and Source from <a href="http://www.freecsstemplates.org/" rel="nofollow">FreeCSSTemplates.org</a></p>
</div>
</body>
</html>
at the home.aspx page
<%@ Page Title="Home" Language="C#" MasterPageFile="~/Site.master" AutoEventWireup="true"
CodeBehind="Home.aspx.cs" Inherits="Project_Thesis._Default" %>
<asp:Content ID="HeaderContent" runat="server" ContentPlaceHolderID="HeadContent">
</asp:Content>
<asp:Content ID="BodyContent" runat="server" ContentPlaceHolderID="MainContent">
<div id="home">
<div id="content">
<div class="post">
<h2 class="title"><a>Introduction Project V2.0</a></h2>
<div class="entry">
<p>Welcome to my Book Search Project V2.0</p>
<p>In order to search a book click on 'Search' at the top of the screen.</p>
<p>Enjoy and Happy Searching! :)</p>
</div>
<!--<p class="meta"><span class="byline">Posted by <a href="#">Someone</a> on December 22, 2007</span> <a href="#" class="comments">18 comments</a></p>-->
</div>
</div>
</div>
</asp:Content>
When I try to move the location of stuff using the design view it does not let me. Only 1 thing in each line, cant even do spaces in the same line which is strange.
Also sometimes I get the error with direct browsing not enabled. any ideas on how to enable it?
here is the style CSS of the template:
1 /*
2 Design by Free CSS Templates
3 http://www.freecsstemplates.org
4 Released for free under a Creative Commons Attribution 2.5 License
5 */
6
7 * {
8 margin: 0;
9 padding: 0;
10 }
11
12 body {
13 background: #000000 url(images/img01.gif) repeat-x;
14 font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;
15 font-size: 13px;
16 color: #999999;
17 }
18
19 h1, h2, h3 {
20 }
21
22 h1 {
23 font-size: 3em;
24 }
25
26 h2 {
27 letter-spacing: -1px;
28 font-size: 2em;
29 }
30
31 h3 {
32 font-size: 1em;
33 }
34
35 p, ul, ol {
36 margin-top: 1.8em;
37 line-height: 180%;
38 }
39
40 ul, ol {
41 margin-left: 3em;
42 }
43
44 blockquote {
45 margin-left: 3em;
46 margin-right: 3em;
47 }
48
49 a {
50 color: #CCCCCC;
51 }
52
53 a:hover {
54 text-decoration: none;
55 color: #FFFFFF;
56 }
57
58 hr {
59 display: none;
60 }
61
62 /* Header */
63
64 #header {
65 width: 960px;
66 height: 80px;
67 margin: 0 auto;
68 background: url(images/img02.jpg);
69 }
70
71 #header h1, #header h2 {
72 float: left;
73 margin: 0;
74 text-transform: uppercase;
75 color: #FFFFFF;
76 }
77
78 #header h1 {
79 padding: 30px 0 0 20px;
80 font-size: 3em;
81 }
82
83 #header h2 {
84 padding: 47px 0 0 8px;
85 font-size: 1.8em;
86 font-style: italic;
87 }
88
89 #header a {
90 text-decoration: none;
91 color: #FFFFFF;
92 }
93
94 /* Menu */
95
96 #menu {
97 width: 960px;
98 height: 51px;
99 margin: 0 auto;
100 background: url(images/img03.jpg);
101 }
102
103 #menu ul {
104 margin: 0;
105 padding: 0;
106 list-style: none;
107 line-height: normal;
108 }
109
110 #menu li {
111 float: left;
112 padding: 12px 10px 0 20px;
113 }
114
115 #menu a {
116 text-decoration: none;
117 letter-spacing: -1px;
118 font-size: 1.2em;
119 font-weight: bold;
120 }
121
122 #menu a:hover {
123 text-decoration: underline;
124 }
125
126 /* Page */
127
128 #page {
129 width: 920px;
130 margin: 0 auto;
131 padding: 30px 20px 20px 20px;
132 background: url(images/img04.jpg) no-repeat;
133 }
134
135 /* Content */
136
137 #content {
138 float: left;
139 width: 605px;
140 }
141
142 .post {
143 margin-bottom: 40px;
144 }
145
146 .post .title {
147 border-bottom: 1px solid #454545;
148 }
149
150 .post .title a {
151 text-decoration: none;
152 }
153
154 .post .entry {
155 padding: 0 20px;
156 }
157
158 .post .meta {
159 height: 20px;
160 padding: 15px 20px;
161 background: url(images/img05.gif) no-repeat;
162 line-height: normal;
163 }
164
165 .post .meta a {
166 text-decoration: none;
167 font-weight: bold;
168 }
169
170 .post .meta a:hover {
171 text-decoration: underline;
172 }
173
174 .post .meta .byline {
175 float: left;
176 }
177
178 .post .meta .comments {
179 float: right;
180 }
181
182 /* Sidebar */
183
184 #sidebar {
185 float: right;
186 width: 295px;
187 }
188
189 #sidebar ul {
190 margin: 0;
191 padding: 0;
192 list-style: none;
193 }
194
195 #sidebar li {
196 }
197
198 #sidebar li ul {
199 padding: 0 0 20px 20px;
200 list-style: square inside;
201 }
202
203 #sidebar h2 {
204 height: 50px;
205 padding: 13px 20px 0 20px;
206 background: url(images/img06.gif) no-repeat;
207 font-size: 1.6em;
208 }
209
210 /* Search */
211
212 #search {
213 padding: 20px;
214 text-align: center;
215 }
216
217 #search input {
218 margin-bottom: 10px;
219 padding: 3px 5px;
220 background: #1F1F1F url(images/img06.gif) no-repeat center center;
221 border: 1px solid #454545;
222 font: bold 1.2em "Trebuchet MS", Arial, Helvetica, sans-serif;
223 color: #FFFFFF;
224 }
225
226 #search #s {
227 width: 80%;
228 background: #1F1F1F;
229 }
230
231 /* Calendar */
232
233 #calendar {
234 padding-bottom: 20px;
235 }
236
237 #calendar table, #calendar caption {
238 width: 80%;
239 margin: 0 auto;
240 text-align: center;
241 }
242
243 #calendar caption {
244 text-transform: uppercase;
245 letter-spacing: .25em;
246 font-weight: bold;
247 }
248
249 #calendar thead th {
250 background: #333333;
251 }
252
253 #calendar tbody td {
254 background: #111111;
255 }
256
257 #calendar a {
258 text-decoration: none;
259 font-weight: bold;
260 }
261
262 #calendar a:hover {
263 text-decoration: underline;
264 }
265
266 /* Footer */
267
268 #footer {
269 width: 960px;
270 margin: 0 auto;
271 padding: 20px 0;
272 background: url(images/img07.gif) no-repeat;
273 }
274
275 #footer p {
276 margin: 0;
277 line-height: normal;
278 text-align: center;
279 }
I found another CSS called site.css, here are the contents
/* DEFAULTS
----------------------------------------------------------*/
body
{
background: #b6b7bc;
font-size: .80em;
font-family: "Helvetica Neue", "Lucida Grande", "Segoe UI", Arial, Helvetica, Verdana, sans-serif;
margin: 0px;
padding: 0px;
color: #696969;
}
a:link, a:visited
{
color: #034af3;
}
a:hover
{
color: #1d60ff;
text-decoration: none;
}
a:active
{
color: #034af3;
}
p
{
margin-bottom: 10px;
line-height: 1.6em;
}
/* HEADINGS
----------------------------------------------------------*/
h1, h2, h3, h4, h5, h6
{
font-size: 1.5em;
color: #666666;
font-variant: small-caps;
text-transform: none;
font-weight: 200;
margin-bottom: 0px;
}
h1
{
font-size: 1.6em;
padding-bottom: 0px;
margin-bottom: 0px;
}
h2
{
font-size: 1.5em;
font-weight: 600;
}
h3
{
font-size: 1.2em;
}
h4
{
font-size: 1.1em;
}
h5, h6
{
font-size: 1em;
}
/* this rule styles <h1> and <h2> tags that are the
first child of the left and right table columns */
.rightColumn > h1, .rightColumn > h2, .leftColumn > h1, .leftColumn > h2
{
margin-top: 0px;
}
/* PRIMARY LAYOUT ELEMENTS
----------------------------------------------------------*/
.page
{
width: 960px;
background-color: #fff;
margin: 20px auto 0px auto;
border: 1px solid #496077;
}
.header
{
position: relative;
margin: 0px;
padding: 0px;
background: #4b6c9e;
width: 100%;
}
.header h1
{
font-weight: 700;
margin: 0px;
padding: 0px 0px 0px 20px;
color: #f9f9f9;
border: none;
line-height: 2em;
font-size: 2em;
}
.main
{
padding: 0px 12px;
margin: 12px 8px 8px 8px;
min-height: 420px;
}
.leftCol
{
padding: 6px 0px;
margin: 12px 8px 8px 8px;
width: 200px;
min-height: 200px;
}
.footer
{
color: #4e5766;
padding: 8px 0px 0px 0px;
margin: 0px auto;
text-align: center;
line-height: normal;
}
/* TAB MENU
----------------------------------------------------------*/
div.hideSkiplink
{
background-color:#3a4f63;
width:100%;
}
div.menu
{
padding: 4px 0px 4px 8px;
}
div.menu ul
{
list-style: none;
margin: 0px;
padding: 0px;
width: auto;
}
div.menu ul li a, div.menu ul li a:visited
{
background-color: #465c71;
border: 1px #4e667d solid;
color: #dde4ec;
display: block;
line-height: 1.35em;
padding: 4px 20px;
text-decoration: none;
white-space: nowrap;
}
div.menu ul li a:hover
{
background-color: #bfcbd6;
color: #465c71;
text-decoration: none;
}
div.menu ul li a:active
{
background-color: #465c71;
color: #cfdbe6;
text-decoration: none;
}
/* FORM ELEMENTS
----------------------------------------------------------*/
fieldset
{
margin: 1em 0px;
padding: 1em;
border: 1px solid #ccc;
}
fieldset p
{
margin: 2px 12px 10px 10px;
}
fieldset.login label, fieldset.register label, fieldset.changePassword label
{
display: block;
}
fieldset label.inline
{
display: inline;
}
legend
{
font-size: 1.1em;
font-weight: 600;
padding: 2px 4px 8px 4px;
}
input.textEntry
{
width: 320px;
border: 1px solid #ccc;
}
input.passwordEntry
{
width: 320px;
border: 1px solid #ccc;
}
div.accountInfo
{
width: 42%;
}
/* MISC
----------------------------------------------------------*/
.clear
{
clear: both;
}
.title
{
display: block;
float: left;
text-align: left;
width: auto;
}
.loginDisplay
{
font-size: 1.1em;
display: block;
text-align: right;
padding: 10px;
color: White;
}
.loginDisplay a:link
{
color: white;
}
.loginDisplay a:visited
{
color: white;
}
.loginDisplay a:hover
{
color: white;
}
.failureNotification
{
font-size: 1.2em;
color: Red;
}
.bold
{
font-weight: bold;
}
.submitButton
{
text-align: right;
padding-right: 10px;
}
Thanks!!
My response is about the first CSS you posted...
In the rule .footer add clear:both; to put the footer under main content.
See line 268 in the first CSS and change like this:
#footer { clear: both; width: 960px; margin: 0 auto; padding: 20px 0; background: url(images/img07.gif) no-repeat; }
Hi, try to use div elements to arrange controls in your page..
Replace your particular design part with fallowing & make modifications as per your requirement..If possible after getting your proper design try to remove inline styles for div to centralized css file . Hope this will help you! :)
<div style="height: 200px"> <div style="float: left; width: 40%"> <p> <asp:label id="lblBookTitle" runat="server" text="Book Title" ></asp:label> :</p> <p> <asp:textbox id="txtBookTitle" runat="server" ></asp:textbox> </p> <p> <asp:label id="lblISBNNo" runat="server" text="ISBN Number :" ></asp:label> </p> <p> <asp:textbox id="TXtISBNNo" runat="server" ></asp:textbox> </p> <p> <asp:button id="btnSearch" runat="server" text="Search" /> </p> </div> <div style="float: left; width: 50%"> <p> <asp:image id="Image1" runat="server" imageurl="http://i622.photobucket.com/albums/tt301/kidown/backgroundpic.jpg" Height="150px" Width="120px" /> </asp:image></p> </div> </div>
Check for all css classes & also attributes which are uncommon.Check if there is any online reference in your site for css,jquery or jscript. Though this problem persists with default template also,you can remove it . :)
这篇关于aspx网页标题定位的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
