Автоматическое "обтекание" результатов из запроса к базе данных PHP - PullRequest
Новая
       28

Автоматическое "обтекание" результатов из запроса к базе данных PHP

0 голосов
/ 30 марта 2012

Что я хотел бы сделать:

- Когда я повторяю свои результаты из запроса MySQL, я хочу отобразить каждый из них в квадратном div (это отсортировано)

- Я также хочу обернуть их, чтобы они все располагались в горизонтальных рядах, но когда экран недостаточно широк, некоторые переходят в несколько рядов

Второй момент - это тот, который язастрял с.Как мне обернуть множество элементов, как в случае с переносом слов в текст?

Спасибо!

Ответы [ 2 ]

2 голосов
/ 30 марта 2012

Как это Пример jsFiddle ?

CSS: 

div {
    border:1px solid #999;
    width:30px;
    height:30px;
    float:left;
    margin:4px;
}
0 голосов
/ 30 марта 2012

Я думаю, что этот скрипт создает макет, который вы запрашиваете: 

<html><head><script>
    // dummy code to simulate varying width text received from a database
    var pullFromDatabase = function(){
        str = new String()
        for(var i = Math.round(Math.random()*10)+1; i > 0; i--)
            str += "Data! "
        return str
    }

    window.onload = function(){
        for(var i = 10; i > 0; i--){
            newDiv = document.createElement('div')
            newText = document.createTextNode(pullFromDatabase())
            newDiv.appendChild(newText)
            document.body.appendChild(newDiv)
        }
    }
</script><style>
    div { float: left; width: 200px; height: 200px; border-width: 1px; border-style: solid; border-color: black }
</style></head><body>

</body></html>

Проверьте это в своем HTML-редакторе и посмотрите, выглядит ли он так, как вы хотите. Float: left является ключом к тому, чтобы заставить их «заворачиваться». Обратите внимание, что проблема в основном в CSS, а не в PHP или JS.

...