aiContactSafe formatowanie wewnątrz

[morelo]

Witam zrobiłem taki prosty formularz w aiContactSafe
wiedze czerpie z trąd http://wiki.joomla.pl/Formularz_kont...B3.C5.82y_pola

ale mam jeden problem mianowicie wartości pola i
Lista przełączników opcji: wpisz wszystkie wartości, oddzielając je średnikiem ";"; na przykład kolory: red;yellow;green;blue;black.

i ok działa ale układa jedno po drugim a chciał bym obok siebie jest tez css do danego profilu ale nie reaguje lub ja to źle robie.
Może ktoś już to przerabiał i się podzieli lub pomoże z tym

strona offline

[morelo]

mam tak a chciał bym obok siebie
kod taki

/* 	align - all left
	make sure you have the corect aiContactSafe_mainbody_1 set everywhere on this CSS code
	the number following aiContactSafe_mainbody_ is the id of the profile
	if not properly set, the changes affecting this tag will not take effect
*/


/* display into the center of the page */
div#aiContactSafe_mainbody_1 {
	margin-left:auto;
	margin-right:auto;
}


/*


set the width of some of the fields
add here any of the fields of aiContactSafe
replace "field_name" with the name of the field for which you want to set the width


// Textbox
		div#aiContactSafe_mainbody_1 input#field_name
// Combobox
		div#aiContactSafe_mainbody_1 select#field_name
// Editbox
		div#aiContactSafe_mainbody_1 textarea#field_name
// Checkbox - List
		div#aiContactSafe_mainbody_1 input.field_name
// Radio - List
		div#aiContactSafe_mainbody_1 input.field_name
// Date
		can't modify the width
// Email
		div#aiContactSafe_mainbody_1 input#field_name
// Email - List
		div#aiContactSafe_mainbody_1 select#field_name
// Joomla Contacts
		div#aiContactSafe_mainbody_1 select#field_name
// Joomla Users
		div#aiContactSafe_mainbody_1 select#field_name
// SOBI2 Entries
		div#aiContactSafe_mainbody_1 select#field_name
// Hidden
		nothing to set
// Separator
		div#aiContactSafe_mainbody_1 div#sp_field_name
// File
		only a very complex solution will fix this problem
// Number
		div#aiContactSafe_mainbody_1 input#field_name
// Hidden Email
		nothing to set


*/
div#aiContactSafe_mainbody_1 input#aics_name {
	width:240px;
}
div#aiContactSafe_mainbody_1 input#aics_email {
	width:240px;
}
div#aiContactSafe_mainbody_1 input#aics_phone {
	width:240px;
}
div#aiContactSafe_mainbody_1 input#aics_subject {
	width:240px;
}
div#aiContactSafe_mainbody_1 textarea#aics_message {
	width:240px;
	height:80px;
}


/* set the way labels and fields are displayed */
div#aiContactSafe_mainbody_1 div.aiContactSafe_row {
	clear:both;
	padding:2px 0px;
}
div#aiContactSafe_mainbody_1 div.aiContactSafe_contact_form_field_label_left {
	clear:both;
}
div#aiContactSafe_mainbody_1 div.aiContactSafe_contact_form_field_right {
	clear:both;
}


div#aiContactSafe_mainbody_1 div.aiContactSafe_contact_form_field_label_right {
	float:left;
}
div#aiContactSafe_mainbody_1 div.aiContactSafe_contact_form_field_left {
	float:left;
}


/* center the contact form */
div#aiContactSafe_mainbody_1 #aiContactSafeForm {
	margin-left:auto;
	margin-right:auto;
}


/* set the space between the notification for the required fields to the contact form */
div#aiContactSafe_mainbody_1 div#aiContactSafe_info {
	margin-bottom:10px;
}


/* set the div containing the captcha */
div#aiContactSafe_mainbody_1 div#div_captcha {
	clear:both;
	margin:5px 0px;
	padding-top:10px;
}
div#aiContactSafe_mainbody_1 div#div_captcha_info {
	margin-bottom:5px;
}


/* set the way the text counting the characters in the edit box */
div#aiContactSafe_mainbody_1 div.countdown_div {
	font-size:9px;
}
div#aiContactSafe_mainbody_1 input.countdown_editbox {
	font-size:9px;
	text-align:center;
	border:none;
	overflow:visible;
	background:transparent;
}


/* set the cells containig the contact form and the contact information */
div#aiContactSafe_mainbody_1 table#aiContactSafeForm td, div#aiContactSafe_mainbody_1 div#aiContactSafeForm {
	padding:5px;
	vertical-align:top;
}


/* modify the cursor of the labels to let the user know they can click on them */
div#aiContactSafe_mainbody_1 label {
	cursor:pointer;
}
/* set the label tag containing the character that marks the required fields */
div#aiContactSafe_mainbody_1 label.required_field {
	text-align:left;
	vertical-align:top;
	margin-left:5px;
}


/* hide the hidden rows */
div#aiContactSafe_mainbody_1 div.aiContactSafe_row_hidden {
	display:none;
}


/* make the buttons higher */
div#aiContactSafe_mainbody_1 div#aiContactSafeBtns input {
	padding:5px;
	margin:0px;
}


/* set the way the date is displayed */
div#aiContactSafe_mainbody_1 table.aiContactSafe_date td {
	padding:0px 0px 0px 0px;
	vertical-align:middle;
}
div#aiContactSafe_mainbody_1 table.aiContactSafe_date td select {
	margin:0px 2px 0px 0px;
}


/* set the space between field sufix and the field and between the field prefix and the field */
div#aiContactSafe_mainbody_1 span.aiContactSafe_sufix {
	margin-right:3px;
}
div#aiContactSafe_mainbody_1 span.aiContactSafe_prefix {
	margin-left:3px;
}

[morelo]

CZy ktoś wie jak zrobić by szablon był w dwóch pionowych kolumnach?

[Karol99]

Na oba Twoje pytania jest jedna odpowiedź: css. Trzeba poczytać, popatrzeć jak robią inni, poeksperymentować...

(No, poza tym, że w opcjach odpowiedniej pozycji menu trzeba ustawić wyświetlanie w dwóch kolumnach - jeśli masz na myśli wprowadzenia artykułów wyświetlane w dwóch kolumnach. Ale i tak szablon musi mieć odpowiednie ostylowanie w css.)

[morelo]

Na pierwsze pytanie znalazłem tylko jedną odp i to bardzo ubogą, ale by podzielić formularz na dwie kolumny to nic mam ustawione w dwóch kolumnach próbowałem pozmieniać w css ale nie wychodzi lub moja wiedza za słaba liczyłem że już ktoś to robił i pomoże.

[Karol99]

Obawiam się, że tu kursu css nie napiszemy. Wiedza na ten temat jest w sieci dostępna - szukaj, podpatruj działające rozwiązania... Powodzenia!