Как задать css выводимым записям из Mysql?

zlojnaxa · 24 июл 2016

Здравствуйте уважаемые программисты. Есть код который выводит из БД записи постранично:

PHP:

include_once "db.php";

$per_page=5;

if (isset($_GET['page'])) $page=($_GET['page']-1); else $page=0;

$start=abs($page*$per_page);

$select="SELECT * FROM XXXXX WHERE activate = '1' ORDER BY `XXXXX2` DESC LIMIT $start,$per_page";

$result=mysql_query($select);

$select="SELECT count(*) FROM `XXXXX`";

$result=mysql_query($select);

$row=mysql_fetch_row($result);

$total_rows=$row[0];

$num_pages=ceil($total_rows/$per_page);

Проблема в этом коде, который показывает текущую страницу и ссылки на остальные:

PHP:

for($i=1;$i<=$num_pages;$i++) {

if ($i-1 == $page) {

echo $i. " ";

}

else {

echo '<a href="'.$_SERVER['PHP_SELF'].'?page='.$i.'">'.$i."</a> ";

}

}

Все работает отлично (в частности номера страниц отображаются как положенно). Но когда я $i заключаю в <div> в 1 и 2 случае, для красивого отображения на экране (страница на которой находится юзер в белой обводке с красным background, страница со ссылкой просто в белой обводке без background), то номера страниц начинают отображаться коряво. При переходе на вторую страницу цифра 1 (первая стр.) перескакивает направо а цифра 2 (вторая стр.) налево, то есть они меняются местами. Вопрос весь в том: как по человечески оформить CSS- ом, что бы ничто никуда не уезжало при переходе на последующие страницы?

denis01 · 25 июл 2016

@zlojnaxa можешь дать ссылку где посмотреть в живую на корявую нумерацию? Посмотрим на исходный код. Ещё можешь добавить код с помощью которой генерируешь html, а он коряво отображается. Сейчас ты показал только код который работает. Но жалуешься на другой код который не работает. Будет проще помочь, если покажешь не рабочий код и результат его выполнения. Точнее какой html он генерирует.

На счёт mysql_* его в версии PHP 7 уже удалили, надо переходить на mysqli_* или PDO. Это совет на будущее.

Ещё можно более наглядно оформлять HTML который будет генерироваться с помощью PHP:
https://secure.php.net/manual/ru/language.basic-syntax.phpmode.php
https://secure.php.net/manual/ru/function.echo.php

Пример, чтобы сложнее было запутаться

PHP:

<?php

for($i=1;$i<=$num_pages;$i++) {

if ($i-1 == $page) {

?>

<?=$i?>

<?php

} else {

?>

<a href="<?=$_SERVER['PHP_SELF'].'?page='.$i?>"><?=$i?></a>

<?php

}

}

zlojnaxa · 25 июл 2016

denis01 сказал(а): ↑

@zlojnaxa можешь дать ссылку где посмотреть в живую на корявую нумерацию? Посмотрим на исходный код. Ещё можешь добавить код с помощью которой генерируешь html, а он коряво отображается. Сейчас ты показал только код который работает. Но жалуешься на другой код который не работает. Будет проще помочь, если покажешь не рабочий код и результат его выполнения. Точнее какой html он генерирует.

На счёт mysql_* его в версии PHP 7 уже удалили, надо переходить на mysqli_* или PDO. Это совет на будущее.

Ещё можно более наглядно оформлять HTML который будет генерироваться с помощью PHP:
https://secure.php.net/manual/ru/language.basic-syntax.phpmode.php
https://secure.php.net/manual/ru/function.echo.php

Пример, чтобы сложнее было запутаться

PHP:

<?php

for($i=1;$i<=$num_pages;$i++) {

if ($i-1 == $page) {

?>

<?=$i?>

<?php

} else {

?>

<a href="<?=$_SERVER['PHP_SELF'].'?page='.$i?>"><?=$i?></a>

<?php

}

}

Нажмите, чтобы раскрыть...

Ок, сейчас накидаю и залью на сервер что бы было наглядно.

zlojnaxa · 25 июл 2016

denis01 сказал(а): ↑

можешь дать ссылку где посмотреть в живую на корявую нумерацию
Нажмите, чтобы раскрыть...

Вот ссылка:
http://cu45045.tmweb.ru/
С двумя страницами (когда выводил по 5 записей) еще не так страшно смотрелось. Ради интереса сделал вывод по 1 записи- вообще ужас, но зато наглядней выглядит.
Исходники на всякий случай.

PHP:

<?php

session_start();

header('Content-Type: text/html; charset=utf-8');

include_once "dbconnect.php";

$per_page=1;

if (isset($_GET['page'])) $page=($_GET['page']-1); else $page=0;

$start=abs($page*$per_page);

$reviews_select="SELECT * FROM reviews WHERE active = '1' ORDER BY `date_message` DESC LIMIT $start,$per_page";

$result_reviews=mysql_query($reviews_select);

$avatar_result = mysql_query("SELECT avatar FROM reviews WHERE active = '1'");

?>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">

<head>

<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />

<title>Отзывы</title>

<link rel="stylesheet" href="index.css" type="text/css" />

</head>

<body>

<div class="a1">

<div class="a2">

<div class="a3">

<div class="a4">

Отзывы

</div>

<div class="a5">

<?php

while ($reviewsRow=mysql_fetch_array($result_reviews)) {

echo

('

<div class="a6">

<div class="a7">

</div>

<div class="a8">

'.$reviewsRow[username].'

</div>

<div class="a9">

<div class="img"><img src="'.$reviewsRow[avatar].'"/></div>

</div>

<div class="a10">

'.$reviewsRow[text_message].'

</div>

<div class="a11">

'.$reviewsRow[date_message].'

</div>

</div>

'

);

};

$reviews_select="SELECT count(*) FROM `reviews`";

$result_reviews=mysql_query($reviews_select);

$reviews_row=mysql_fetch_row($result_reviews);

$total_rows=$reviews_row[0];

$num_pages=ceil($total_rows/$per_page);

for($i=1;$i<=$num_pages;$i++) {

if ($i-1 == $page) {

?>

<div class="a12">

<?php

echo " <div class='active_page'>$i</div>";

?>

<?php

}

else {

?>

<?php

echo '<div class="not_active_page"><a href="'.$_SERVER['PHP_SELF'].'?page='.$i.'">'.$i."</a></div> ";

?>

</div>

<?php

}

}

?>

</div>

<?php

if ($_SESSION['ses'] == '') {

echo '

<div class="a13">

Вы не можете оставлять отзывы. Войдите.

</div>

';

}

?>

</div>

</div>

</div>

</body>

</html>

Код (CSS):

.a1 {

width: 960px;

height: auto;

margin: 0 auto;

margin-top: 0px;

}

.a2 {

width: 960px;

height: auto;

margin: 0 auto;

margin-top: 0px;

padding-bottom: 20px;

}

.a3 {

width: auto;

height: auto;

margin-top: 0px;

margin-left: 0px;

color:#FFFFFF;

font-size: 18px;

letter-spacing: 2px;

border-radius: 0px 0px 10px 10px;

background: #808080;

padding: 0px 20px 50px 20px;

text-align: center;

position: relative;

z-index: 0;

}

.a4 {

width: auto;

height: 50px;

margin-left: 0px;

margin-top: 0px;

font-size: 25px;

line-height: 47px;

letter-spacing: 2px;

text-align: center;

}

.a5 {

width: 915px;

height: auto;

margin: 0 auto;

margin-top: 20px;

border-radius: 10px;

}

.a6 {

width: 930px;

height: auto;

margin-left: -9px;

margin-top: 0px;

border-bottom: 1px solid #444444;

}

.a7 {

width: 170px;

height: 150px;

margin-left: 0px;

margin-top: 0px;

}

.a8 {

width: 170px;

height: auto;

padding: 5px 5px 5px 5px;

margin-left: -9px;

margin-top: -150px;

color: #FFFFFF;

}

.a9 {

width: 100px;

height: 100px;

position: relative;

margin-left: 30px;

margin-top: 0px;

border-radius: 25px;

overflow: hidden;

box-shadow: inset 10px 2px 57px -5px rgba(37,37,37,0.9);

border: 1px solid #FFFFFF;

}

.a10 {

width: 720px;

height: auto;

min-height: 130px;

padding: 10px 10px 40px 10px;

margin-left: 170px;

margin-top: -132px;

text-align: left;

color: #FFFFFF;

}

.a11 {

width: auto;

height: auto;

margin-left: 700px;

margin-top: 0px;

color: #464646;

padding-bottom: 10px;

}

.a12 {

width: 500px;

height: auto;

margin: 0 auto;

margin-top: 20px;

border: 1px solid #FFFFFF;

}

.active_page {

width: 35px;

height: 25px;

margin-left: 0px;

margin-top: 0px;

background-color: #ff0000;

color: #FFFFFF;

border: 1px solid #FFFFFF;

border-radius: 5px;

}

.not_active_page {

width: 35px;

height: 25px;

margin-left: 45px;

margin-top: 0px;

background-color: #730000;

color: #FFFFFF;

border: 1px solid #FFFFFF;

border-radius: 5px;

}

a {

color: #FFFFFF;

}

.a13 {

width: auto;

height: auto;

margin: 0px auto;

margin-top: 50px;

background: #444444;

border-radius: 5px;

border: 1px solid #444444;

color: #FFF;

padding: 15px;

text-align: center;

font-size: 20px;

letter-spacing: 2px;

line-height: 30px;

}

PHP:

<?php

if(!mysql_connect("localhost","cu45045_big","11111"))

{

die('oops connection problem ! --> '.mysql_error());

}

if(!mysql_select_db("cu45045_big"))

{

die('oops database selection problem ! --> '.mysql_error());

}

?>

denis01 · 25 июл 2016

ты на 92 строке выводишь лишний div, который разрывает всю html разметку у пагинации. там же это видно в исходном коде странице, лишний div, можешь посчитать количество открытых div и закрытых, и перепроверить вложенность друг в друга тегов, у тебя там франкинштейн не правильно с клееный

zlojnaxa · 25 июл 2016

denis01 сказал(а): ↑

ты на 92 строке выводишь лишний div, который разрывает всю html разметку у пагинации. там же это видно в исходном коде странице, лишний div, можешь посчитать количество открытых div и закрытых, и перепроверить вложенность друг в друга тегов, у тебя там франкинштейн не правильно с клееный
Нажмите, чтобы раскрыть...

Да вроде 16 открытых и 16 закрытых, переписал чутка для удобства восприятия, удалил "Войдите для отзыва"-проблема осталась:

PHP:

<?php

session_start();

header('Content-Type: text/html; charset=utf-8');

include_once "dbconnect.php";

$per_page=1;

if (isset($_GET['page'])) $page=($_GET['page']-1); else $page=0;

$start=abs($page*$per_page);

$reviews_select="SELECT * FROM reviews WHERE active = '1' ORDER BY `date_message` DESC LIMIT $start,$per_page";

$result_reviews=mysql_query($reviews_select);

$avatar_result = mysql_query("SELECT avatar FROM reviews WHERE active = '1'");

?>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">

<head>

<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />

<title>Отзывы</title>

<link rel="stylesheet" href="index.css" type="text/css" />

</head>

<body>

<div class="a1">

<div class="a2">

<div class="a3">

<div class="a4">

Отзывы

</div>

<div class="a5">

<?php

while ($reviewsRow=mysql_fetch_array($result_reviews)) {

echo

('

<div class="a6">

<div class="a7">

</div>

<div class="a8">

'.$reviewsRow[username].'

</div>

<div class="a9">

<div class="img"><img src="'.$reviewsRow[avatar].'"/></div>

</div>

<div class="a10">

'.$reviewsRow[text_message].'

</div>

<div class="a11">

'.$reviewsRow[date_message].'

</div>

</div>

'

);

};

$reviews_select="SELECT count(*) FROM `reviews`";

$result_reviews=mysql_query($reviews_select);

$reviews_row=mysql_fetch_row($result_reviews);

$total_rows=$reviews_row[0];

$num_pages=ceil($total_rows/$per_page);

for($i=1;$i<=$num_pages;$i++) {

if ($i-1 == $page) {

?>

<div class="a12">

<?php

echo " <div class='active_page'>$i</div>";

?>

<?php

}

else {

?>

<?php

echo '<div class="not_active_page"><a href="'.$_SERVER['PHP_SELF'].'?page='.$i.'">'.$i."</a></div> ";

?>

</div>

<?php

}

}

?>

</div>

</div>

</div>

</div>

</body>

</html>

Или я может не вижу- ткните носом, но на 92 строке нету div вообще, только если на 91 строке закрывающий div- но он закрывает <div class="a12"> . И со вложенностью тегов тоже вроде все норм. Вот нарыл: http://codepen.io/vineethtr/pen/MYBeyB?editors=1100
но не пойму как применить.

denis01 · 25 июл 2016

zlojnaxa сказал(а): ↑

только если на 91 строке закрывающий div- но он закрывает <div class="a12"> .
Нажмите, чтобы раскрыть...

ага, 91 строка.
ну я в google chrome запустил поиск по исходному коду, искал <div находит 20 совпадений, потом ищу </div> и уже 25, так что вот так.
постарайся часов 8 потратить, чтобы выучить весь код, проследить полностью за кодом, посчитай вручную все теги, перепроверь вложенность, так научишься находить ошибки.

Ещё отладку можешь посмотреть:

debug
http://phpfaq.ru/debug
https://netbeans.org/kb/docs/php/debugging_ru.html
https://php.ru/forum/threads/howto-...i-po-shagam-i-s-kartinkami.58974/#post-474550
--- Добавлено ---

zlojnaxa сказал(а): ↑

Вот нарыл: http://codepen.io/vineethtr/pen/MYBeyB?editors=1100
но не пойму как применить.
Нажмите, чтобы раскрыть...

Там есть css и html код, нужно его скопировать, не нарушая последовательности и логику вложенности, показывай как пробовал, подскажем где ошибка
--- Добавлено ---
У тебя ещё первая строка в исходном коде пустая, это очень плохо, doctype с второй строки может не сработать (это из-за 12 строки), и там XHTML и 1999 год, это 666 если перевернуть, не надо так делать

Используй такой doctype, кодировка через meta по другому объявлена:

HTML:

<!DOCTYPE html>

<html>

<head>

<meta charset="utf-8">

<title></title>

</head>

<body>

</body>

</html>

Как задать css выводимым записям из Mysql?

zlojnaxa Активный пользователь

denis01 Суперстар
Команда форума Модератор

zlojnaxa Активный пользователь

zlojnaxa Активный пользователь

denis01 Суперстар
Команда форума Модератор

zlojnaxa Активный пользователь

denis01 Суперстар
Команда форума Модератор

Быстрый поиск

Как задать css выводимым записям из Mysql?

zlojnaxa Активный пользователь

denis01 Суперстар Команда форума Модератор

zlojnaxa Активный пользователь

zlojnaxa Активный пользователь

denis01 Суперстар Команда форума Модератор

zlojnaxa Активный пользователь

denis01 Суперстар Команда форума Модератор

denis01 Суперстар
Команда форума Модератор

denis01 Суперстар
Команда форума Модератор

denis01 Суперстар
Команда форума Модератор