Support » Plugin: Simple Ajax Chat » My css tips for showing the shoutbox with bottom input field

  • Resolved angeljs

    (@angeljs)


    I’m not an expert at css at all, but after a bit of trial and error I managed to place the input field at the bottom of the shoutbox window so I could have the shoutbox at the top of my site:

    div#simple-ajax-chat{width:100%;overflow:hidden;margin:0 0 20px 0;}
    div#sac-content{display:none;}
    div#sac-output{float:top;width:100%;height:300px;overflow:auto;border:1px solid #d1d1d1;}
    div#sac-output.sac-reg-req{float:none;width:100%;height:auto;border:0;}
    div#sac-latest-message{padding:5px 10px;font-size:14px;background-color:#d1d1d1;text-shadow:1px 1px 1px rgba(255,255,255,0.5);}
    ul#sac-messages{margin:10px 0;padding:0;font-size:14px;line-height:20px;}
    ul#sac-messages li{margin:0;padding:4px 10px;}
    ul#sac-messages li span{font-weight:bold;}
    div#sac-panel{float:left;width:100%;}
    form#sac-form fieldset{margin:0 0 5px 0;padding:0;border:0;}
    form#sac-form fieldset label,form#sac-form fieldset input,form#sac-form fieldset textarea{float:left;clear:both;width:94%;margin:0 0 2px 0;font-size:14px;}
    form#sac-form fieldset textarea{height:133px;}
    .tooltip{border:0;text-shadow:none;}

    Just paste it into the chatbox css settings. If anyone can improve on this, please do, but it worked for me!

Viewing 1 replies (of 1 total)
Viewing 1 replies (of 1 total)
  • You must be logged in to reply to this topic.