使用PHP代码在twitter推文时间线中图像和文本没有正确对齐

时间:2015-07-26 13:01:04

标签: php api twitter alignment timeline

我正在尝试使用php代码检索我的Twitter主页的时间线。当我尝试重现时间轴时,个人资料图片和推文文字未正确对齐。当我在图片标签中使用浮动时,一些推文正确对齐,但其中一些是未对齐的。我无法附上screenshot.i不想使用javascript.can有人让我知道我犯了什么错误。 我希望个人资料图片和推文文字并排。  HTML代码:

<html>
<head>
<link rel="stylesheet" type="text/css" href="style.css">

</head>
<body>
<?php
require_once('TwitterAPIExchange.php');
/** Set access tokens here - see: https://dev.twitter.com/apps/ **/
$settings = array(
    'oauth_access_token' => "",
    'oauth_access_token_secret' => "",
    'consumer_key' => "",
    'consumer_secret' => ""
);
$url = "https://api.twitter.com/1.1/statuses/home_timeline.json";
$requestMethod = "GET";
if (isset($_GET['user'])) {$user = $_GET['user'];} else {$user = "srini001";}
if (isset($_GET['count'])) {$count = $_GET['count'];} else {$count = 20;}
$getfield = "?screen_name=$user&count=$count";
$twitter = new TwitterAPIExchange($settings);
$string = json_decode($twitter->setGetfield($getfield)
->buildOauth($url, $requestMethod)
->performRequest(),$assoc = TRUE);

$user_timeurl = "https://api.twitter.com/1.1/statuses/user_timeline.json";
$user_timestring = json_decode($twitter->setGetfield($getfield)
->buildOauth($user_timeurl, $requestMethod)
->performRequest(),$assoc = TRUE);


if($string["errors"][0]["message"] != "") {echo "<h3>Sorry, there was a problem.</h3><p>Twitter returned the following error message:</p><p><em>".$string[errors][0]["message"]."</em></p>";exit();}
$x = 1;

echo"test";echo "<br />";
$twet="RT @MercedesAMGF1: Good to see @SChecoPerez and @NicoHulkenberg back in business today. Top work from @ForceIndiaF1 :) #MBFamily #F1";
echo "$twet";echo "<br />";
        $txt = preg_replace('/@(\S+)/i', '<a href="https://twitter.com/#!/$1">@$1</a>', $twet);

echo "$txt";echo "<br />";

foreach($string as $items)
    {
        echo "text";"<br/>";
        $tw = $items['text'];



        echo "$x"; echo "<br />";
        echo "Time and Date of Tweet: ".$items['created_at']."<br />";
        echo "Tweeted by: ". $items['user']['name']."<br />";
        echo "Screen name: ". $items['user']['screen_name']."<br />";
        echo "Followers: ". $items['user']['followers_count']."<br />";
        echo "Friends: ". $items['user']['friends_count']."<br />";
        echo "Listed: ". $items['user']['listed_count']."<br /><hr />";
        $x=$x +1;
    }
?>
<div class="blok">
    <h1>html</h1>
    <?php
    foreach($string as $items)
    {
                $tw = $items['text'];
                $screen_name = $items['user']['screen_name'];
                $prof_img = $items['user']['profile_image_url'];
                $txt = preg_replace('/http:\/\/(\S+)/i', '<a href="http://$1">http://$1</a>', $tw);
                $txt = preg_replace('/https:\/\/(\S+)/i', '<a href="http://$1">https://$1</a>', $txt);

                $txt = preg_replace('/#(\S+)/i', '<a href="https://twitter.com/#!/#$1">#$1</a>', $txt);
                                //echo "$txt"; echo "<br />";

                $txt = preg_replace('/@(\S+)/i', '<a href="https://twitter.com/#!/$1">@$1</a>', $txt);


                ?>
                <div ><img style="float:left"  src = "<?= $prof_img ?> "/><?= $txt ?></div>
                <br/>

<?

    }
?>
</div>

<div class="blok">
    htmltest

</div>
</body>
</html>

我的css代码:

.blok{
    display: inline-block;
  font-family: "Helvetica Neue", Roboto, "Segoe UI", Calibri, sans-serif;
  font-size: 12px;
  font-weight: bold;
  line-height: 16px;
  border-color: #eee #ddd #bbb;
  border-radius: 5px;
  border-style: solid;
  border-width: 1px;
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.15);
  margin: 10px 5px;
  padding: 0 16px 16px 16px;
  max-width: 468px;
  max-height: 400px;
  overflow-y: auto;
}

.blok p {
  font-size: 16px;
  font-weight: normal;
  line-height: 20px;
}

.blok a {
  color: blue;
  font-weight: normal;
  text-decoration: none;
  outline: 0 none;
}

.blok a:hover,
blockquote.twitter-tweet a:focus {
  text-decoration: underline;
}

1 个答案:

答案 0 :(得分:0)

我将css更新为:

.line{    
    height: 60px;
    margin-left:65px;

  }

  .twprof{
    height: 60px;
    float: left;

  }

我还将html代码更新为:

<div class="twprof" ><img src = "<?= $prof_img ?> "/></div><div class="line" ><b><?= $screen_name ?> : </b><?= $txt ?></div>

现在工作正常。