Metin Merkezinde doğru konuyor değil

2 Cevap php

Bu benden başka noobish hatadır ama benim sayfa bazı metin yerleştirilir ettik ama bana dikey merkezinde benim Metin yerleştirmek için benim div etiketi için bazı dolgu ekleyerek sonra bu imkansız. İşte benim sorunun bir önizleme:

My Problem

CSS:

body {
    background-image: url(../images/body-bg.jpg);
    font-family: arial;
}

.cms-head {
    background-image: url(../images/cms-head.png);
    background-repeat: no-repeat;
    width: 850px;
    height: 50px;
    padding: 5px;
    margin-bottom: -10px;
}

.posts-list {
    background-image: url(../images/new-post-b.png);;
    width: 840px;
    height: 500px;
    padding: 5px;
    border-bottom: 1px solid #000000;
}

.content {
    width: 850px;
    height: 500px;
    margin-left: auto;
    margin-right: auto;
}

.edit-post-but {
    background-image: url(../images/new-button.png);
    background-repeat: no-repeat;
    width: 60px;
    height: 40px;
}

.post-title {
    width: 834px;
    height: 40px;
    background-image: url(../images/post-head.png);
    background-repeat: no-repeat;
    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;
    margin-left: auto;
    margin-right: auto;
    padding: 5px;
    font-size: 20px;
    color: #ffffff;
}

.bottom {
    width: 850px;
    height: 50px;
    background-image: url(../images/cms-bot.png);
    background-repeat: no-repeat;
}

a:active, a:link, a:visited{
    color: #ffffff;
}
a:hover{
    text-decoration:none;
}

HTML / PHP:

<html>
<head>
<title>Blog Name | Edit Post</title>
<link rel="stylesheet" href="css/cms.css" type="text/css" />
</head>
<body>
<div class="content">
<div class="cms-head">
<a href="newpost.php"><img src="images/new-button.png" /></a>
<a href="#"><img src="images/rss-button.png" /></a>
</div>
<div class="posts-list">
<?php
mysql_connect ('localhost', 'root', 'root') ;
mysql_select_db ('tmlblog');

$result = mysql_query("SELECT timestamp, id, title FROM php_blog ORDER BY id DESC");

while($row = mysql_fetch_array($result)) {
    $date  = date("l F d Y",$row['timestamp']);
    $id = $row['id'];
    $title = strip_tags(stripslashes($row['title']));

    if (mb_strlen($title) >= 50) {
        $title = substr($title, 0, 50);
        $title = $title . "...";
    }
    print("<div class='post-title'><a href=\"update.php?id=" . $id . "\"><img src='images/edit-button.png'></a>$title<br /></div>");
}

mysql_close();

?>
</div>
<div class="bottom"></div>
</div>
</body>
</html>

2 Cevap

div.post-title
{
  padding-bottom: 10px;
}
div.post-title > a > img
{
  margin-bottom: -6px;
}

Marjı ve dolgu iyi görünmesi için bazı ayarlamalar gerekebilir.

line-height: 40px .post-title ekle.

etiketler