Page 1 of 1
Displaying li elements horizontally.
Posted: Wed May 11, 2011 12:19 pm
by ta2shop
thanks EcazS , much better!
but the problem is the css, how can i display dhem horazontly, i tried with display: inline and block but it is not working.
thanks.
#cart{
margin:0 auto;
padding:5px;
width:99%;
border:solid #FFF 1px;
font-family:"Arial Rounded MT Bold";
font-size:16px;
color:#FFF;
font-weight:lighter;
}
#products{
margin:0;
padding:0;
text-decoration:none;
font-family:"Arial Rounded MT Bold";
font-size:16px;
color:#fff;
border:solid #FFF 1px;
width:200px;
height:200px;
}
#products li{
margin:0;
padding:0;
list-style-type:none;
display:block;
float:left;
}
#products li a{
font-family:"Arial Rounded MT Bold";
font-size:16px;
color:#F00;
text-decoration:none;
margin:0;
padding:0;
}
#products li a:hover{
font-family:"Arial Rounded MT Bold";
font-size:16px;
color:#F00;
text-decoration:underline;
margin:0;
padding:0;
}
Re: modifiing code problem
Posted: Wed May 11, 2011 12:28 pm
by jacek
You would want to float the li elements
li {
float: left;
}
If you have any more problems on this, post in the css section
Re: modifiing code problem
Posted: Wed May 11, 2011 12:36 pm
by ta2shop
ok, i will, but i am floating the li tag!
Re: modifiing code problem
Posted: Wed May 11, 2011 1:07 pm
by EcazS
You can do
display: inline-block;
If you want all 3 lists horizontally then apply the display or float to ul in the css.
Re: modifiing code problem
Posted: Wed May 11, 2011 2:32 pm
by ta2shop
somthing is wrong with the code! a mean i cant put the css on it.
function products() {
$get = mysql_query('SELECT id, name, description, price FROM products WHERE quantity > 0 ORDER BY id DESC') or die(mysql_error());
if(mysql_num_rows($get)==0) {
echo "There are no products to display!";
}
else {
while($get_row = mysql_fetch_assoc($get)) {
echo'<ul id=\'products\'><li><b>'.$get_row['name'].'</b></li>
<li>'.$get_row['description'].'</li>
<li>'.number_format($get_row['price'],2).
'€ <a href="cart.php?add='.$get_row['id'].'">Add</a></li></ul>';
}
}
}
if i put the css on the products id it wount do nothing. if i put it on the li tag, still nothing!
Re: modifiing code problem
Posted: Wed May 11, 2011 2:35 pm
by EcazS
Do you have a product id in your css file?
Is it #product or ul#product ?
Re: modifiing code problem
Posted: Wed May 11, 2011 2:44 pm
by ta2shop
i have a div id="cart" i put a ul tag in the while loop with id="products"
Re: modifiing code problem
Posted: Wed May 11, 2011 2:49 pm
by EcazS
ta2shop wrote:i have a div id="cart" i put a ul tag in the while loop with id="products"
If you don't have those IDs in your CSS file nothing is going to happen
Re: Displaying li elements horizontally.
Posted: Wed May 11, 2011 2:54 pm
by ta2shop
but i do here is the css for the cart thing:
#cart{
margin:0 auto;
padding:0;
width:100%;
border:solid #FFF 1px;
font-family:"Arial Rounded MT Bold";
font-size:16px;
color:#FFF;
font-weight:lighter;
}
#products{
margin:0 auto;
padding:10px;
text-decoration:none;
font-family:"Arial Rounded MT Bold";
font-size:16px;
color:#fff;
border:solid #FFF 1px;
width:180px;
height:180px;
display:inline-block;
}
#products li{
margin:0;
padding:0;
list-style-type:none;
display:inline-block;
float:left;
}
#products li a{
font-family:"Arial Rounded MT Bold";
font-size:16px;
color:#F00;
text-decoration:none;
margin:0;
padding:0;
}
#products li a:hover{
font-family:"Arial Rounded MT Bold";
font-size:16px;
color:#F00;
text-decoration:underline;
margin:0;
padding:0;
}
Re: Displaying li elements horizontally.
Posted: Wed May 11, 2011 4:30 pm
by EcazS
That's weird. Unless I just became blind I can't see anything wrong.
Try doing
li#products {
//stuff
}
Not that it should make a difference
Re: Displaying li elements horizontally.
Posted: Wed May 11, 2011 5:39 pm
by ta2shop
nothing hapens! wired ha