Контент в блоке

fro · June 5, 2015

Прощу помочь, у меня есть блок, его я хочу использовать для помещения контента на сайт, но проблема в том, что текст или картинка всегда вылезают за его рамки, как этому помешать ?

<div class="content"></div>;

.content{background:#FFFFFF;position:absolute;height:100%;width:980px;top:0;right:0;bottom:0;left:0;margin:0 auto;}

Edited June 5, 2015 by fro

afdw · June 5, 2015

overflow: hidden;

fro · June 5, 2015

overflow: hidden;

но теперь текст и по вертикали тоже отрезается

afdw · June 5, 2015

overflow: hidden;
но теперь текст и по вертикали тоже отрезается

overflow: auto;

?

fro · June 5, 2015

overflow: hidden;
но теперь текст и по вертикали тоже отрезается
overflow: auto;
?

помогло =) вот только появилась полоса прокрутки на самом блоке с права, хотелось бы ее убрать в правую часть браузера, как на всех сайтах, есть такая возможность ?

afdw · June 5, 2015

помогло =) вот только появилась полоса прокрутки на самом блоке с права, хотелось бы ее убрать в правую часть браузера, как на всех сайтах, есть такая возможность ?

Дайте сайт

fro · June 5, 2015

<!DOCTYPE html>

<html>

<head>

</head>

<body>

</html>

body {

background: no-repeat #A9A9A9;

-moz-background-size: 100%;

-webkit-background-size: 100%;

-o-background-size: 100%;

background-size: 100%;

}

.content{

background:#FFFFFF;

position:absolute;

height:100%;

width:980px;

top:10%;

right:0;

bottom:0;

left:0;

margin:0 auto;

overflow: auto;

}

.text{

margin: 0;

padding: 30px}

afdw · June 5, 2015

Так всё же правильно, в чём проблема? http://jsfiddle.net/w78Lbjae/

fro · June 5, 2015

дело вот в этой полоске =) я понял что это зависит от параметра height но вот как сделать что бы он расширялся по мере добавляния контента

afdw · June 5, 2015

http://jsfiddle.net/w78Lbjae/1/

fro · June 5, 2015

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

afdw · June 5, 2015

Такое возможно только с помощью JS. И да, вам понадобится серверная часть. Без неё обойтись можно, но это будет очень сложно и бесполезно. Расскажите, что будет за контент?

fro · June 5, 2015

это будет блог, поэтому в основном новости, ну и изначальный смысл сделать его самому =)

afdw · June 5, 2015

это будет блог, поэтому в основном новости, ну и изначальный смысл сделать его самому =)

Какая будет CMS?

fro · June 5, 2015

это будет блог, поэтому в основном новости, ну и изначальный смысл сделать его самому =)
Какая будет CMS?

на mysql и php

afdw · June 6, 2015

Вы должны будете написать скрипт, который берёт по 10 постов из БД и конвертирует их в JSON. Пример запроса:

GET /posts?start=10

Ответ:

{  "posts": [    {      "title": "Post 11",      "text": "Content of post",      "date": "Sat Jun 06 2015 09:55:05 GMT+0300 (MSK)"    },    {      "title": "Post 12",      "text": "Content of post",      "date": "Sat Jun 06 2015 09:55:05 GMT+0300 (MSK)"    },    {      "title": "Post 13",      "text": "Content of post",      "date": "Sat Jun 06 2015 09:55:05 GMT+0300 (MSK)"    },    {      "title": "Post 14",      "text": "Content of post",      "date": "Sat Jun 06 2015 09:55:05 GMT+0300 (MSK)"    },    {      "title": "Post 15",      "text": "Content of post",      "date": "Sat Jun 06 2015 09:55:05 GMT+0300 (MSK)"    },    {      "title": "Post 16",      "text": "Content of post",      "date": "Sat Jun 06 2015 09:55:05 GMT+0300 (MSK)"    },    {      "title": "Post 17",      "text": "Content of post",      "date": "Sat Jun 06 2015 09:55:05 GMT+0300 (MSK)"    },    {      "title": "Post 18",      "text": "Content of post",      "date": "Sat Jun 06 2015 09:55:05 GMT+0300 (MSK)"    },    {      "title": "Post 19",      "text": "Content of post",      "date": "Sat Jun 06 2015 09:55:05 GMT+0300 (MSK)"    },    {      "title": "Post 20",      "text": "Content of post",      "date": "Sat Jun 06 2015 09:55:05 GMT+0300 (MSK)"    }  ]}

Далее при сколе по XMLHTTPRequest получаете посты и рендерите их. Когда напишете скрипт - отпишитесь, помогу со второй частью.

fro · June 6, 2015

ну если уже создавать базу данных, то лучше арендовать сервер, где будет подешевле ?=)

ShumNo · June 6, 2015

начали что текст за блок вылезает, а закончили арендой сервера.

может проще убрать все эти абсолюты высоты и т.д и блок сам подстроится под высоту контента?

afdw · June 7, 2015

ну если уже создавать базу данных, то лучше арендовать сервер, где будет подешевле ?=)

Да. Но пока для вас лучший вариант - localhost

fro · June 8, 2015

ну если уже создавать базу данных, то лучше арендовать сервер, где будет подешевле ?=)
Да. Но пока для вас лучший вариант - localhost

я взял хост на хостланд =) вроде норм, теперь буду разбираться с кодом

fro · June 9, 2015

ну если уже создавать базу данных, то лучше арендовать сервер, где будет подешевле ?=)
Да. Но пока для вас лучший вариант - localhost

я почитал пару статей и понял, что сначала нужно сделать автоматическое создание страниц для новостей, а так же их редактор на странице сайта, а не в html, и создать для них (даже не представляю как) отдельную базу данных, что бы новости хранились там а не в документе html, не подскажешь, с чего начать ?=)

afdw · June 10, 2015

Ну создаёте вы БД.

CREATE DATABASE `blog`CHARACTER SET utf8 COLLATE utf8_general_ci;USE `blog`;

Создаёте таблицу новостей.

CREATE TABLE `news` (  `new_key` int(11) NOT NULL AUTO_INCREMENT,  `new_title` text NOT NULL,  `new_text` text NOT NULL,  `new_date` timestamp NOT NULL DEFAULT CURRENT_TIMESTAMP,  PRIMARY KEY (`post_key`),  UNIQUE KEY `unique_new_key` (`new_key`)) ENGINE=MyISAM AUTO_INCREMENT=1 DEFAULT CHARSET=utf8;

Далее заходите через клиент (рекомендую HeidiSQL) и добавляете туда несколько новостей. Поле new_key будет автоматически инкрементироваться, а new_date - становиться текущем временем.

Далее скачиваете этот файлик и создаёте рядом "db.php" следующего содержания:

<?php	include "safemysql.class.php";	$db = new SafeMysql(array(		'user' => 'пользователь',		'pass' => 'пароль',		'db' => 'база данных(у меня в примере была `blog`)',		'charset' => 'utf8'	));

И ещё один там же "test.php":

<?php	include "db.php";	$news = $db->getAll("SELECT * FROM news");	var_dump($news);

При заходе через браузер в последний должны появиться ваши новости.

Edited June 10, 2015 by afdw

fro · June 11, 2015

CREATE TABLE `news` ( `new_key` int(11) NOT NULL AUTO_INCREMENT, `new_title` text NOT NULL, `new_text` text NOT NULL, `new_date` timestamp NOT NULL DEFAULT CURRENT_TIMESTAMP, PRIMARY KEY (`post_key`), UNIQUE KEY `unique_new_key` (`new_key`) ) ENGINE=MyISAM AUTO_INCREMENT=1 DEFAULT CHARSET=utf8;

как я понимаю нужно еще создать строку post_key ?

afdw · June 11, 2015

CREATE TABLE `news` ( `new_key` int(11) NOT NULL AUTO_INCREMENT, `new_title` text NOT NULL, `new_text` text NOT NULL, `new_date` timestamp NOT NULL DEFAULT CURRENT_TIMESTAMP, PRIMARY KEY (`post_key`), UNIQUE KEY `unique_new_key` (`new_key`) ) ENGINE=MyISAM AUTO_INCREMENT=1 DEFAULT CHARSET=utf8;
как я понимаю нужно еще создать строку post_key ?

Нет, это я ошибся. Вот правильно:

CREATE TABLE `news` (  `new_key` int(11) NOT NULL AUTO_INCREMENT,  `new_title` text NOT NULL,  `new_text` text NOT NULL,  `new_date` timestamp NOT NULL DEFAULT CURRENT_TIMESTAMP,  PRIMARY KEY (`new_key`),  UNIQUE KEY `unique_new_key` (`new_key`)) ENGINE=MyISAM AUTO_INCREMENT=1 DEFAULT CHARSET=utf8;

fro · June 11, 2015

он почему то ругается на эту строчку

$db = new SafeMysql(array(

и почему не надо указывать место нахождения базы данных ?

afdw · June 11, 2015

Есть ли в этой папке файл "safemysql.class.php"? И какая ошибка?

Sign In

Контент в блоке

Question

Link to comment

Share on other sites

Top Posters For This Question

Popular Days

Top Posters For This Question

Popular Days

90 answers to this question

Recommended Posts

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Join the conversation

Обсуждения

Important Information