[CSS] Zaokrąglone rogi ramki


(adam951) #1

Witam! Ciąg dalszy mojej przygody z robieniem radia internetowego..

Adres to: www.mixclub.xaa.pl/cms

Po prawej stronie jest panel z pozdrowieniami którego kod to:

/* Tło strony i czcionka */

body {

	padding: 0px;

	margin: 0px;

	background: #3C3C3C;

	font-size: 15px;

	font-family: Verdana;

}


/* Ramka oraz rozmiary formularza */

.ramka {

	margin-top: 0px;

	border: solid #F7F7F7;

	border-width: 0px;

	width: 180px;

	height: 250px;

}


/* Tytuł formularza, górna część */

.napis {

	height: 25px;

	background: #F7F7F7

	font-size: 30px;

	color: #FFFFFF;

	text-align: center;

}


/* Dolna część formularza */

.pole {

	background: #F7F7F7;

	padding: 6px;

	border: solid #636363;

	border-width: 1px 0px 0px 0px;

	color: #4A4A4A;

	font-weight: bold;

}


/* Pole do wpisywania treści pozdrowień */

.tresc {

	border: 1px solid #2D2D2D;

	background: #FFF9ED;

	width: 164px;

	height: 80px;

	color: #4A4A4A;

	-moz-border-radius: 4px;

}


/* Pole do wpisywania nicku */

.nick {

	border: 1px solid #2D2D2D;

	background: #FFF9ED;

	width: 160px;

	color: #4A4A4A;

	-moz-border-radius: 4px;

}


/* Pole wyświetlające liczbę znaków */

.licznik {

	border: 1px solid #2D2D2D;

	background: #FFF9ED;

	width: 30px;

	text-align: center;

	color: #4A4A4A;

	margin-right: 5px;

	-moz-border-radius: 4px;

}


/* Przycisk służący do wysłania pozdrowień */

.przycisk {

	background: #2E7DB6;

	height: 22px;

	border: 1px solid #2D2D2D;

	color: #FFFFFF;

	padding-bottom: 2px;

	margin-top: 4px;

	-moz-border-radius: 4px;

}

Chcę zrobić zaokrąglone rogi żeby to się komponowało z resztą strony. W internecie znalazłem sterty kodu ale ni w ząb nie potrafię tego tu zastosować..


(Drobok) #2
-moz-border-radius: 10px;

-webkit-border-radius: 10px;

border-radius: 10px;

Co ci nie pasuje w tym co masz ?

//edit

Twoje wypowiedzi nic mi nie mówią :slight_smile:


(adam951) #3

Bo nie chodzi o to. Żeby cała ramka miała zaokrąglenia rogów. A nie jej elementy. :wink:

//EDIT

Chodzi o to żeby rogi zaznaczone na zdjęciu czerwonym były zaokrąglone. http://imageshack.us/photo/my-images/854/rogig.jpg/


(Rishikbp) #4

Do .ramka powinieneś dodać zaokrąglenia, jeżeli zależy ci, aby jej rogi były zaokrąglone.

.ramka {

margin-top: 0px;

border: solid #F7F7F7;

border-width: 0px;

width: 180px;

height: 250px;

-moz-border-radius: 10px;

}

Próbowałeś tak i nie działa?


(Grzelix) #5

Podejrzałem w kod strony i... muszę powiedzieć że jest to zrobione w bardzo złym stylu programistycznym.

Powinieneś użyć styli css z strony. wtedy zachował byś identyczny wygląd z elementami na stronie i po drugie w momencie jakiejkolwiek zmiany w stylach strony wszystkie informacje masz w jednym miejscu.

O ile nie jest za późno mocno bym polecał zastosowanie powyższej rady.


(adam951) #6

@grzelix Wiem. W CSS jestem zielony, moje pierwsze kroki w nim. Od podstaw w zasadzie znam tylko HTML. ;/ Wykonałem to czystą amatorką.

Jeżeli miałbym to poprawić to potrzebuje duużej pomocy od kogoś obeznanego w temacie (chętny?).

@Vicodin Nie działa.

//EDIT:

Nie napisałem o jednej rzeczy (przez nieuwagę). Kod z pierwszego postu mam w panelu radiowym z którego do nowego panelu w PHP Fusion wstawiam coś takiego:

echo '


' ;

[/code]