Neden "Sayfa [0]" dır

2 Cevap php

Benim "Sayfa [0]" metin web sayfamda merkezli değildir. Herkes neden biliyor musun? Ben gerçekten yardıma lütfen kullanabilirsiniz.

İşte html:

<html>
    <head>

        <title>Test Forum</title>
        <link href="http://prime.programming-designs.com/test_forum/style.css" rel="stylesheet" type="text/css" />


    </head>

    <body>

        <a href="http://prime.programming-designs.com/test_forum/"><img src="http://prime.programming-designs.com/test_forum//images/banner1.png" alt="" id="banner" /></a>

        <h1>Test Forums</h1>


        <hr />

        <div id="navi"><div id="naviheader">Boards</div><a href="http://prime.programming-designs.com/test_forum/viewboard.php?board=0">Testing</a><br /><a href="http://prime.programming-designs.com/test_forum/viewboard.php?board=1">General Discussion</a><br /><a href="http://prime.programming-designs.com/test_forum/viewboard.php?board=2">Video Games</a><br /><a href="http://prime.programming-designs.com/test_forum/viewboard.php?board=3">Anime and Manga</a><br /><a href="http://prime.programming-designs.com/test_forum/viewboard.php?board=4">BlazBlue</a><br /><a href="http://prime.programming-designs.com/test_forum/viewboard.php?board=5">Shin Megami Tensei</a><br /><a href="http://prime.programming-designs.com/test_forum/viewboard.php?board=6">Earthbound</a><br /><a href="http://prime.programming-designs.com/test_forum/viewboard.php?board=7">Phantasy Star</a><br /><a href="http://prime.programming-designs.com/test_forum/viewboard.php?board=8">Mobile Suit Gundam</a><br /></div>      
        <div class="postbox"><h4>CyanPrime</h4><hr />Welcome to the King's Gate BBS!</div>Page: [<a href="http://prime.programming-designs.com/test_forum/index.php?page=0">0</a>]      
    </body>
</html>

İşte CSS:

@charset "windows-1252";    

body{
    background-color: #EEFFF8;
    color: #000000;
    text-align: center;
}

.postbox{
    text-align: left;
    margin: auto;
    background-color: #dbfef8;
    border: 1px solid #82FFCD;
    width: 50%;
    margin-top: 10px;
}   

.stickypostbox{
    text-align: left;
    margin: auto;
    background-color: #F5FFFA;
    border: 1px solid #82FFCD;
    width: 50%;
    margin-top: 10px;
}   

h4{
    margin: 0px 0px 0px 0px;
    padding: 0px 0px 0px 0px;
    color: #9932CC;
}

h1{
    color: #551A8B;
}

hr{
    color: #82FFCD;
    background-color: #82FFCD;
    height: 1px;
    border: 0px dotted #82FFCD;
}

a{
    color: #7F00FF;
    text-decoration: none;
}

a:hover{
    color: #7F00FF;
    text-decoration: underline;
}

form{
   margin: 0px auto;
   width: 50%;
}

#formdiv {
  background-color:#dbfef8;
  border:1px solid #82FFCD;
}


.fielddiv1{
    background-color: #f9f9f9;
    border: 1px solid #DBFEF8;
    vertical-align: middle;
    width: 45%;
    float: left;
}

.fielddiv2{
    background-color: #f9f9f9;
    border: 1px solid #DBFEF8;
    vertical-align: middle;
    width: 100%;
}

.fieldtext1{
    width: 50%;
    background-color: #82FFCD;
    float: left;
}

.fieldtext2{
    width: 100%;
    background-color: #82FFCD;
}

#replydiv{
    width: 100%;
    background-color: #DBFEF8;
    margin: 10px 0 10px 0;
}

#admindiv{
    width: 100%;
    background-color: #DBFEF8;
    margin: 10px 0 10px 0;
}

#navi{
    width: 200px;
    background-color: #dbfef8;
    border: 1px solid #82FFCD;
    text-align: left;
    float: left;
}

#naviheader{
    width: 100%;
    background-color: #82FFCD;
}

#submitbutton{
    border: 1px solid #82FFCD; 
    background-color: #DBFEF8; 
    color: #000000; 
    margin-top: 5px; 
    width: 100px; 
    height: 20px;
}

#banner{
    border: 1px solid #82FFCD;
}

.postbar{
margin-right: 0px;
margin-top: 0px;
}

.bannedtext{
    margin: 0px 0px 0px 0px;
    padding: 0px 0px 0px 0px;
    color: #FF0000;
}

Ve burada web sayfası böylece (sen benim "sayfa [0]" diğer kurullarında merkezli olduğunu fark edeceğiz, ama bazı bağlamda alabilirsiniz değildir endeksi. http://prime.programming-designs.com/test_forum/

2 Cevap

Soldaki şamandıra sağa içeriği bastırıyor. Hala çizgi boyunca merkezli, ama bu sayfa boyunca merkezde değil. .postbox büyük bir alt kenar ekleyerek bunu göstermektedir.

Centreing sorun illustrated

Benim önerim bir <div> olarak altbilgi kaydırmak olacaktır. {[(1)}] (ya da left), yüzen eleman telafi etmek için her iki ucunda kenar eklemek, ya da position: absolute; left: 0; right: 0; sayfa boyunca centreing zorla verin ya.

Değiştir:

Page: [<a href="http://prime.programming-designs.com/test_forum/index.php?page=0">0</a>]

(Çağrı cihazı sınıfı ile bir div kaydırmak) için:

<div class="pager">Page: [<a href="http://prime.programming-designs.com/test_forum/index.php?page=0">0</a>]</div>

CSS Bu değiştirin:

.postbox, .pager{
  text-align: left;
  margin: auto;
  width: 50%;
  margin-top: 10px;
} 
.postbox { 
  background-color: #dbfef8;
  border: 1px solid #82FFCD;
}
.pager { 
  text-align: center;
}

Float içerik üzerinde bastırıyor çünkü bu oluyor nedenidir. Sen çağrı cihazı düz gövde etiketi kapalı geliyor. Genel olarak, bir html öğesinin içinde düz metin sarmak için en iyisidir.

Sayfanızın yapısını tekrar isteyebilirsiniz. Sol sütun ve bir merkez sütun div veya bunun gibi bir şey yaratmak.

etiketler