表中的循环动态值

Question

I have the following loop, showing me results from a certain page.

foreach($json->rooms as $room)
{
    echo '<p><b>' . $room->name . '</b></p>';

    foreach($room->meetings as $meeting)
    {
        echo '<p><b>' . $meeting->subject . '</b></p>'; 
        echo '<p><b>Organizor:</b> ' . $meeting->organizer . '</p>';
        echo '<p><b>Start:</b> ' . $meeting->start . '</p>';
        echo '<p><b>End:</b> ' . $meeting->end . '</p>';
        echo '<p><b>Duration:</b> ' . $meeting->duration . '</p>';          
    }
}

This shows me a result like:

Room 1
     Subject
          startTime
          endTime
          totalTime 
     Subject
          startTime
          endTime
          totalTime  Room 2
Room 2

Room 3

Room 4

As you can see, we have 4 rooms. in 1 room there are 2 appointments (at different times of the day).

My question: With only 2 appointments, the screen won't be filled alot. But if we have a appointment in every room, the page will get very long.

What i would like is something like this:

Room 1
     Subject              Subject
          startTime            startTime
          endTime              endTime
          totalTime            totalTime

Room 2

Room 3

Room 4

So that every appointment of the same room, will be next to the other of that room.

How do i do this while it is in a loop?

Answer 1

First, wrap the entire meeting in a <div> tag by adding <div class="meeting"> to the very start of the first echo in the meeting loop. Then add a closing </div> to the end of the last echo in the meeting loop. Then you can use some CSS styling like the following to display this correctly:

.meeting {
    width:200px;
    display:inline-block;
}

This will make them sit inline - you can adjust the width to your preference.

Edit

You could use floats (float:left) but that add's a whole new level of complexity with the requirements of a clearfix, but you can read more on that here if you wish:

What is a clearfix?