ReSQL.ru
     
powered by simpleCommunicator - 2.0.61     © 2026 Programmizd 02
Мобильная версия    Контакт    Правила    FAQ    Помощь
Целевая тема:
Создать новую тему:
Автор:
Закрыть
Цитировать
Доб. в избранное | Игнор. тему | Прикреп. тему | Пометить прочит. / непрочит. | Фильтр
Форумы / Java [игнор отключен] [закрыт для гостей] / Как тег <h:form> поместить в центр экрана?
11 сообщений из 11, страница 1 из 1
Как тег <h:form> поместить в центр экрана?
    #39075058
Askat
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Askat
Участник
Привет всем! подскажите как форму авторизации поместить в центр экрана, styleClass="center" не помогает? Спасибо!

Код: xml
1.
2.
3.
4.
5.
6.
7.
8.
9.
10.
11.
12.
13.
14.
15.
16.
17.
18.
19.
20.
21.
22.
23.
24.
25.
26.
27.
28.
<?xml version='1.0' encoding='UTF-8' ?>
<!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"  
      xmlns:h="http://java.sun.com/jsf/html"
      xmlns:p="http://primefaces.org/ui">
<h:head>
    <title>login</title>
</h:head>
<h:body>
    <h:form id="loginForm" style="font-size:14px" styleClass="center">          
        <p:growl id="msg" showDetail="true" life="3000" />
        <p:panel header="Авторизация" style="width:280px;height:150px;text-align:center" >
            <h:panelGrid id="loginPanel" columns="2">
                <h:outputText value="Логин:" />
                <p:inputText id="username" value="#{login.user}" ></p:inputText>
<!--                <p:spacer></p:spacer>-->
                <p:message for="username" ></p:message>
                <h:outputText value="Пароль:" />
                <p:password id="password" value="#{login.pwd}"  feedback="false"></p:password>
<!--                <p:spacer></p:spacer>-->
                <p:message for="password"></p:message>
<!--                <p:spacer></p:spacer>-->
                <p:commandButton style="float:left;" action="#{login.validateUsernamePassword}" value="Войти" update="loginForm" ajax="true"></p:commandButton>
            </h:panelGrid>
         </p:panel>
     </h:form>        
</h:body>
</html>
...
Рейтинг: 0 / 0
13.10.2015, 08:48
| Ответить | Цитировать | Написать  
Как тег <h:form> поместить в центр экрана?
    #39075067
qi_ip
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
qi_ip
Гость
AskatПривет всем! подскажите как форму авторизации поместить в центр экрана, styleClass="center" не помогает? Спасибо!

Код: xml
1.
2.
3.
4.
5.
6.
7.
8.
9.
10.
11.
12.
13.
14.
15.
16.
17.
18.
19.
20.
21.
22.
23.
24.
25.
26.
27.
28.
<?xml version='1.0' encoding='UTF-8' ?>
<!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"  
      xmlns:h="http://java.sun.com/jsf/html"
      xmlns:p="http://primefaces.org/ui">
<h:head>
    <title>login</title>
</h:head>
<h:body>
    <h:form id="loginForm" style="font-size:14px" styleClass="center">          
        <p:growl id="msg" showDetail="true" life="3000" />
        <p:panel header="Авторизация" style="width:280px;height:150px;text-align:center" >
            <h:panelGrid id="loginPanel" columns="2">
                <h:outputText value="Логин:" />
                <p:inputText id="username" value="#{login.user}" ></p:inputText>
<!--                <p:spacer></p:spacer>-->
                <p:message for="username" ></p:message>
                <h:outputText value="Пароль:" />
                <p:password id="password" value="#{login.pwd}"  feedback="false"></p:password>
<!--                <p:spacer></p:spacer>-->
                <p:message for="password"></p:message>
<!--                <p:spacer></p:spacer>-->
                <p:commandButton style="float:left;" action="#{login.validateUsernamePassword}" value="Войти" update="loginForm" ajax="true"></p:commandButton>
            </h:panelGrid>
         </p:panel>
     </h:form>        
</h:body>
</html>



А css-кой не получается разместить?
...
Рейтинг: 0 / 0
13.10.2015, 09:01
| Ответить | Цитировать | Написать  
Как тег <h:form> поместить в центр экрана?
    #39075068
qi_ip
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
qi_ip
Гость
Типа такого:

Код: css
1.
style="position: fixed; top: 40%; left: 50%; transform: translate(-50%, -50%);"
...
Рейтинг: 0 / 0
13.10.2015, 09:03
| Ответить | Цитировать | Написать  
Как тег <h:form> поместить в центр экрана?
    #39075109
Askat
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Askat
Участник
qi_ip,

не работает
...
Рейтинг: 0 / 0
13.10.2015, 09:40
| Ответить | Цитировать | Написать  
Как тег <h:form> поместить в центр экрана?
    #39075125
Фотография Petro123
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Petro123
Участник
Askat,
http://www.sql.ru/forum/html-javascript-css
...
Рейтинг: 0 / 0
13.10.2015, 09:56
| Ответить | Цитировать | Написать  
Как тег <h:form> поместить в центр экрана?
    #39075140
Фотография Blazkowicz
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Blazkowicz
Участник
Askat,

Научитесь смотреть HTML в браузере. Чтобы выровнять по центру элемент нужно
1) Чтобы родительский элемент был тоже выровнен по центру, либо полностью заполнял видимую область.
2) Чтобы именно у родительского элемента был стиль text-align:center

Посмотрите пример
http://www.w3schools.com/cssref/pr_text_text-align.asp
и сравните с вашими элементами в браузере
...
Рейтинг: 0 / 0
13.10.2015, 10:09
| Ответить | Цитировать | Написать  
Как тег <h:form> поместить в центр экрана?
    #39075223
Askat
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Askat
Участник
Petro123Askat,
http://www.sql.ru/forum/html-javascript-css


Блииин CSS цеплять надо, думал у JSF своя функция имеется!
...
Рейтинг: 0 / 0
13.10.2015, 11:16
| Ответить | Цитировать | Написать  
Как тег <h:form> поместить в центр экрана?
    #39075241
Фотография Petro123
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Petro123
Участник
AskatБлииин CSS цеплять надо, думал у JSF своя функция имеется!
там наверняка есть не функция, а поле:
- CSS Atributes\HTML Atributes при регионе (div) c формой.
Декларативно надо писать))
...
Рейтинг: 0 / 0
13.10.2015, 11:25
| Ответить | Цитировать | Написать  
Как тег <h:form> поместить в центр экрана?
    #39075249
ivanra
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
ivanra
Гость
Askat,
имеется. Можно заинлайнить с помощью h:outputStylesheet
И кстати, css тоже не всегда поможет
- когда форма может не влезть в размеры экрана
- когда невозможно управлять выравниванием в родительских элементах (например, портальное приложение)
тогда js, типа такого (для примера - выравнивание по вертикали)
Код: html
1.
2.
3.
4.
5.
6.
	<h:outputScript>
(function(){
	var $login = jQuery("#login_container");
	$login.offset({top:Math.max(0,(jQuery(window).height()-$login.height())/2)});
})();
	</h:outputScript>
...
Рейтинг: 0 / 0
13.10.2015, 11:29
| Ответить | Цитировать | Написать  
Как тег <h:form> поместить в центр экрана?
    #39075255
Фотография Petro123
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Petro123
Участник
Askat,
такого нет?
Это другой фреймворк (APEX).
Но если нету, то это печально и недекларативно))
...
Рейтинг: 0 / 0
13.10.2015, 11:31
| Ответить | Цитировать | Написать  
Как тег <h:form> поместить в центр экрана?
    #39075263
Фотография Petro123
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Petro123
Участник
ivanra
Код: html
1.
$login.offset


это скорее всего переместить JS.
А лучше вёрсткой\тегами
IMHO
...
Рейтинг: 0 / 0
13.10.2015, 11:33
| Ответить | Цитировать | Написать  
11 сообщений из 11, страница 1 из 1
Форумы / Java [игнор отключен] [закрыт для гостей] / Как тег <h:form> поместить в центр экрана?
Найденые пользователи ...
Разблокировать пользователей ...
Читали тему (0):
Читали форум (0):
Пользователи онлайн (0):
Польз. соглашение   Полит. конфиден.  
NoSQL.ru       Кролег: Проекты, Новости, Чат       РЕД ФОРУМ       Фотоальбом: Участники, Встречи
Закрыть
start [/forum/topic.php?fid=59&gotonew=1&tid=2124831]:
 0ms
get settings:
 6ms
get forum list:
 18ms
check forum access:
 3ms
check topic access:
 3ms
track hit:
 163ms
get topic data:
 6ms
get first new msg:
 3ms
get forum data:
 1ms
get page messages:
 27ms
get tp. blocked users:
 1ms
others: 217ms
total:  448ms
созд. / загр.: 448ms
x
x
Закрыть


Просмотр
0 / 0
Close
Debug Console [Select Text]