Register

If this is your first visit, please click the Sign Up now button to begin the process of creating your account so you can begin posting on our forums! The Sign Up process will only take up about a minute of two of your time.

Results 1 to 3 of 3
  1. #1
    Junior Member
    Join Date
    Feb 2018
    Posts
    7
    Member #
    58467

    Items showing vertical and not next to each other

    How do i get these items to show next to each other instead of vertical. Im using flex-box
    Attached Images Attached Images

  2.  

  3. #2
    Junior Member
    Join Date
    Aug 2019
    Posts
    13
    Member #
    60927
    Liked
    4 times
    flex-direction: row; ?

  4. #3
    Junior Member
    Join Date
    Feb 2018
    Posts
    7
    Member #
    58467
    THis is what I have now
    Code:
    <?php
    
    /* FOR L1 LEVEL PAGE NEWS CAROUSEL */
    /* CALLED FROM WITHIN L1 PAGE FORMAT */
    /* CJB 2-6-2017 */
    
    
    $site = "http://libnews.syr.edu/";
    
    $file = "http://libnews.syr.edu/category/spotlight/feed/";
    
    echo '<!-- $file -->';
    
    $xml = simplexml_load_file($file);
    
    $tempCounter = 0;
    
    //Missing image placeholder
    $tempImage = "/news/images/news-placeholder-200.png";
    
    echo "<div class=\"page-row-block news-single-column\">";
    echo "<h2 class=\"section-heading\">Latest News and Events";
    //echo "<span class=\"carousel-controls pull-right\">";
    //echo "<button class=\"prev hidden-xs\" data-slide=\"prev\" href=\"#testimonials-carousel\">";
    //echo "<img alt=\"Scroll left\" src=\"../_siteassets/img-arrow-left.png\"></button> ";
    //echo "<button class=\"next hidden-xs\" data-slide=\"next\" href=\"#testimonials-carousel\">";
    //echo "<img alt=\"Scroll right\" src=\"../_siteassets/img-arrow-right.png\"></button>";
    //echo "</span>";
    echo "</h2>";
    //echo "<div class=\"section-content\">";
    //echo "<div class=\"testimonials-carousel carousel slide home-page\" id=\"testimonials-carousel\">";
    //echo "<div class=\"carousel-inner\">";
    
    
    foreach($xml->channel->item as $item) {
    
    # DISPLAY 3 ITEMS
        if ( $tempCounter < 3) {
      
        if (isset($item->title)) {
        $title = trim((string) $item->title);
        } else {
        $title = "";
        }
        
        if (isset($item->description)) {
        $desc = trim((string) $item->description);
        } else {
        $desc = "";
        }
        
        if (isset($item->description)) {
        $excerpt = trim((string) $item->description);
        } else {
        $excerpt = "";
        }
        
        if (isset($item->link)) {
        $link  = trim((string) $item->link);
        } else {
        $link = "";
        }
    
        //Load  <description> into XML object
        $descxml = new SimpleXMLElement("<xml>".$desc."</xml>");
        
      
      //Get <img> src and  <description> text
      if (isset($descxml->div[0]->a->img['src'])) {
        $image = trim((string) $descxml->div[0]->a->img['src']);
      } else {
        $image = $tempImage;
      }
    
      //Get <img> alt and truncate to avoid long alt text error
      if (isset($descxml->div[0]->a->img['alt'])) {
        $alt = trim((string) $descxml->div[0]->a->img['alt']);
        $alt = substr($alt, 0, 80);
      } else {
        $alt = $title;
        $alt = substr($alt, 0, 70);
        $alt = $alt." photo";
      }
        
      //Escape description
      $excerpt = (string) $descxml;
        
      //remove line breaks and tabs from string
      $excerpt = str_replace("\n", "", $excerpt);
      $excerpt = str_replace("\t", "",  $excerpt); 
      
     
      //WRITE EACH ITEM
    
    echo "<ul class=\"flex-container\">";
    foreach($xml->channel->item as $item) {
                          
    			echo "<li class=\"flex-item\"><src=\"$image\" alt=\"$desc\" description=\"$description\" width=\"100\" onerror=\"this.src=\"$tempImage\"\"/></li>"; 
                                //echo "<a class=\"read-more\" href=\"$link\" title=\"Read $title\"><img class=\"pull-left\" src=\"$image\" alt=\"$alt\" width=\"100\" onerror=\"this.src='$tempImage'\"/></a>";
        echo "<h3>$title</h3>";
        echo "<a class=\"read-more continue-reading\" href=\"$link\" title=\"Read $title\">Continue reading →</a>";
    }
    echo "</ul>";
                            
    //"<li class=\"flex-item\"><img class=\"pull-left\" src=\"$image\" alt=\"$alt\" width=\"100\" onerror=\"this.src=\"$tempImage\"\"/></li>"; ?>
                      
            <?php
             echo "</div>";
      if ($tempCounter == "0") {
          echo "<div class=\"item active\">";
      } else {
          echo "<div class=\"item\">";
      }
        //echo "<div class=\"pull-left col-lg-4 col-md-4 col-sm-4 col-xs-12\">";
        //echo "<a class=\"read-more\" href=\"$link\" title=\"Read $title\"><img class=\"pull-left\" src=\"$image\" alt=\"$alt\" width=\"100\" onerror=\"this.src='$tempImage'\"/></a>";
       // echo "</div>";    
       // echo "<div class=\"pull-right col-lg-8 col-md-8 col-sm-8 col-xs-12\">";
       // echo "<h3>$title</h3>";
       // echo "<div class=\"hidden-xs\">$excerpt</div>";
       // echo "<a class=\"read-more continue-reading\" href=\"$link\" title=\"Read $title\">Continue reading →</a>";
       // echo "</div>";  
       // echo "</div>";
    
      
    }
    $tempCounter = $tempCounter;
    
    }
       // echo "</div>"; //CLOSE CAROUSEL INNER
        echo "<div class=\"clearfix\"/>";
       // echo "</div>"; //CLOSE TESTIMONIAL-CAROUSEL
       //echo "</div>"; //CLOSE SECTION-CONTENT
        echo "</div>"; //CLOSE PAGE-ROW-BLOCK    
        echo "<div class=\"btn more-news-bottom pull-right\">";
        echo "<a href=\"$site\">More News</a>";            
    
    
    
    ?>


Remove Ads

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •  
All times are GMT -6. The time now is 03:36 AM.
Powered by vBulletin® Version 4.2.3
Copyright © 2019 vBulletin Solutions, Inc. All rights reserved.
vBulletin Skin By: PurevB.com