Hello,

I am trying to print the following events horizontally instead of vertically. How to do so?

Events

index.php

<?php

include('include/con_database.php');

$result = mysql_query("SELECT * FROM dynamic_content WHERE CatID='4'");

while ($data = mysql_fetch_array($result)){

echo '<div id="banner">';
echo '<div id="title">';
echo '<h1>'.'<a href="http://localhost/IndonusaCMS/events.php?id='.$data['ID'].'">'.$data['title'].'</a>'.'</h1>';
echo '</div>';

echo '<div id="gambar">'.'<img src="images/events/thumb/' . $data['images'] . '">'.'</div>'.'<br>';

/* echo '<div id="text">'.stringTrim($data['content'], 30, 'char').'</div>'.'<br>'; 
echo substr($string, 0, 30); */ 

echo '<div id="text">'.substr($data['content'], 0, 150).'</div>'.'<br>';

echo '</div>';

echo '<div id="next">'.'AA&nbsp'.'</div>';
}

?>

style.css

#banner {margin: 0 0 0 -500px;}
#banner #title a:link{font-size: 15px; text-decoration: none; color: white; margin: 0 0 0 -450px; width: 50px; z-index: 2;}
#banner #title a:visited{font-size: 15px; text-decoration: none; color: white; width:50px; z-index: 2;}
#banner #gambar {margin: -50px 0 0 800px; z-index: 2; position: absolute;}
#banner #text {margin: -30px 0 0 550px; position: absolute; width: 250px; font-size: 6px; color: black; z-index: 2;}

Try:

#gambar { float: left }

You should be using a class instead of an id if you want to apply it to multiple divs.

what's the difference?

It seems like using id is also works fine.

Be a part of the DaniWeb community

We're a friendly, industry-focused community of developers, IT pros, digital marketers, and technology enthusiasts meeting, networking, learning, and sharing knowledge.