Hi guys,
This ones been bothering me for a while now and I can't see to work out the CSS to make this align from left to right. I'll post a few screenshots and my code / css to show you whats happening.
Basically, if I add things to my database and retrieve them on the website, it will display them vertically no problems. But I want it to fill left to right before going down .. if you understand what I mean
Here is the bit of code I am using, just something small for now I need to populate it once I get the layout right... it's in CSHTML, from webmatrix.
-
@foreach(var row in db.Query(odd)){
}
The CSS:
ul#products{
list-style: none;
display: inline;
}
ul#products li{
float: left;
display: inline;
}
ul#products li a {
background: none;
color: black;
text-decoration: none;
}
Attached are two screenshots, the "aligned inventory" I changed via paint, and is how I want it to look.. the other one is the current broken one.
Attachment | Size |
---|---|
unaligned inventory.jpg | 63.96 KB |
aligned inventory.jpg | 80.22 KB |
Sorry, just need to fix it up
Sorry, just need to fix it up a bit...not displaying properly
<ul id="products"> @foreach(var row in db.Query(odd)){ <li><a href="[email protected]"> @row.Name</a></li><br/> <li><a href="~/[email protected]"><img src="pictures/Shirts/@row.Image" width="200" height="200" alt="@row.Name" </li> } </ul>
Nevermind, i figured it out
Nevermind, i figured it out
Oh?
And what was your solution? It's just good netiquette to post your answer; others may need to know also.
cheers,
gary