Tutorial : Styling Ask.fm Widget

Assalamualaikum. Tutor seterusnya, cara untuk edit ask.fm widget. Dekat sini ada 3 styles. Korang boleh pilih. Just copy codes yang tieqa bagi ni. Caranya ;
1. Log in Ask.fm
2. Setting > Widget
3. Pilih saiz. Cth ; 180 x 275
4. Edit CSS > Delete kesemua codes
5. Gantikan dengan codes di bawah ni
Style 1
body {
  margin: 0;
  padding: 0;
  background-color: #fffff;
  overflow: hidden;
  font-family: calibri, sans serif;
}
.askAnywhere-link {
  color: #717171;
}
.askAnywhere-username {
  padding-bottom: 3px;
  border-bottom: solid 1px #434343;
  word-wrap: break-word;
}
.askAnywhere-username-link {
  display: block;
  color: #717171;
  text-decoration: none;
}
.askAnywhere-slogan {
  padding-top: 3px;
  font-weight: normal;
  text-align:right;
  color: #717171;
  letter-spacing: 1px;
  word-wrap: break-word;
}
.askAnywhere-box {
  padding: 10px;
  font-size: 12px;
}
.askAnywhere-input {
  display: block;
  width: 100%;
  max-width: 100%;
  height: 65px;
  max-height: 160px;
  padding: 0px;
  border: solid 1px #434343;
  font-size: 11px;
  text-align: left;
  overflow: auto;
}
.askAnywhere-button {
  border:1px solid #fff;
  border-radius:5px 5px;
  background:#434343;
  color:#fff;
  display: block;
  width:165px;
  padding: 3px 3px;
  margin-top: 10px;
}
#askAnywhere_question_form {
  margin: 0;
  padding: 0;
}
#askAnywhere_input_layer,
#askAnywhere_captcha_layer {
  padding-top: 3px;
  color: #000000;
}
#captcha {
  display: block;
  width: 90px;
  padding: 8px 4px;
  margin-top: 5px;
  border: solid 1px #000000;
  font-size: 14px;
}
div.fieldWithErrors input,
div.fieldWithErrors textarea {
  background: #FA8072;
}

Style 2
body {
  margin: 0;
  padding: 0;
  background-color: #fffff;
  overflow: hidden;
  font-family: calibri, sans serif;
}
.askAnywhere-link {
  color: #717171;
}
.askAnywhere-username {
  padding-bottom: 3px;
  border-bottom: dashed 1px #434343;
  word-wrap: break-word;
}
.askAnywhere-username-link {
  display: block;
  color: #717171;
  text-decoration: none;
}
.askAnywhere-slogan {
  padding-top: 3px;
  font-weight: normal;
  text-align:right;
  color: #717171;
  letter-spacing: 1px;
  word-wrap: break-word;
}
.askAnywhere-box {
  padding: 10px;
  font-size: 12px;
}
.askAnywhere-input {
  display: block;
  width: 100%;
  max-width: 100%;
  height: 65px;
  max-height: 160px;
  padding: 0px;
  border: solid 1px #434343;
  font-size: 11px;
  text-align: left;
  overflow: auto;
}
.askAnywhere-button {
  border:1px dashed #434343;
  border-radius:5px 5px;
  background:#fff;
  color:#434343;
  display: block;
  width:165px;
  padding: 3px 3px;
  margin-top: 10px;
}
#askAnywhere_question_form {
  margin: 0;
  padding: 0;
}
#askAnywhere_input_layer,
#askAnywhere_captcha_layer {
  padding-top: 3px;
  color: #000000;
}
#captcha {
  display: block;
  width: 90px;
  padding: 8px 4px;
  margin-top: 5px;
  border: solid 1px #000000;
  font-size: 14px;
}
div.fieldWithErrors input,
div.fieldWithErrors textarea {
  background: #FA8072;
}

Style 3
body {
  margin: 0;
  padding: 0;
  background-color: #fffff;
  overflow: hidden;
  font-family: calibri, sans serif;
}
.askAnywhere-link {
  color: #717171;
}
.askAnywhere-username {
  padding-bottom: 3px;
  border-bottom: solid 2px #FAEAEA;
  word-wrap: break-word;
}
.askAnywhere-username-link {
  display: block;
  color: #717171;
  text-decoration: none;
}
.askAnywhere-slogan {
  padding-top: 3px;
  font-weight: normal;
  text-align:right;
  color: #717171;
  letter-spacing: 1px;
  word-wrap: break-word;
}
.askAnywhere-box {
  padding: 10px;
  font-size: 12px;
}
.askAnywhere-input {
  display: block;
  width: 100%;
  max-width: 100%;
  height: 65px;
  max-height: 160px;
  padding: 0px;
  border: solid 2px #FAEAEA;
  font-size: 11px;
  text-align: left;
  overflow: auto;
}
.askAnywhere-button {
  border:1px solid #fff;
  border-radius:20px 5px;
  background:#FAE5E5;
  color:#fff;
  display: block;
  width:165px;
  padding: 3px 3px;
  margin-top: 10px;
}
#askAnywhere_question_form {
  margin: 0;
  padding: 0;
}
#askAnywhere_input_layer,
#askAnywhere_captcha_layer {
  padding-top: 3px;
  color: #000000;
}
#captcha {
  display: block;
  width: 90px;
  padding: 8px 4px;
  margin-top: 5px;
  border: solid 1px #000000;
  font-size: 14px;
}
div.fieldWithErrors input,
div.fieldWithErrors textarea {
  background: #FA8072;
}

Posted by at 11:04 PM