Home > Zend_Form > Design Example of Zend_Form

Design Example of Zend_Form

intro
This article describes design elements that were used while creating demonstration site. You can check the screens from demonstration site.

1.Specifying Style Class of Submit Buttons
At first, css class of submit buttons were specified like the following.

<?php
    $decorators = array(
        'ViewHelper',
        array('HtmlTag', array('tag' => 'dt', 'class' => 'submit'))
    );
    $submit = $form->createElement('submit', 'submit');
    $submit->setDecorators($decorators);
2.Creating CSS
Then, css file were created like the following.

// ....
#content dl {
	width: 500px;
}
#content dt {
	width: 150px;
	font-weight: bold;
	border-bottom: 1px solid #ccc;
	padding-top: 0.2em;
	margin: 0;
}
#content dd {
	border-bottom: 1px dashed #ccc;
	margin-top: -1.25em;
	margin-left: 150px;
	padding: 0;
}
#content form dl {
	margin-top: 1em;
}
#content form dt {
	border: 0;
}
#content form dd {
	border: 0;
}
#content .submit {
	width: 150px;
	float: left;
	text-align: center;
	margin-top: 10px;
}
// ...
3.Multilingual
The site can be displayed in English(default) and Japanese(ja). It is switched according to the language preference of your browser.

Comments:0

Comment Form
Remember personal info

Trackbacks:0

Trackback URL for this entry
http://www.oplabo.com/article/31/trackback
Listed below are links to weblogs that reference
Design Example of Zend_Form from Open Programming Laboratory

Home > Zend_Form > Design Example of Zend_Form

Japanese
Pages
Categories
Recent Posts
Recent Comments
Archives
Tag Cloud
Search
Feeds

Return to page top