Develop Reference

How do I send text into a textarea through Selenium and Python as per the HTML:(

I want to click and send text within a textbox but not able to find the element.
This is the html I want to click and send text
<div class="text_write_g comment_write">
<div class="inner_text_write">
<div class="box_textarea">
<textarea placeholder="add coment." maxlength="600" style="height: 86px;"></textarea>
</div>
<div class="wrap_menu">
<div class="area_l">
<button class="btn_g_ico btn_item image_upload_button" data-image-url="" data-image-name="" data-image-size="" id="attach_uploader0"><span class="ico_bbs ico_photo">image_upload</span></button>
<div class="keyboard_wrapper">
<div id="buttonLayer0">
<button id="keyboardBtn0" class="keyboard_btn btn_g_ico btn_item"><span class="ico_bbs ico_emoticon">imoticon</span></button>
</div>
</div>
</div>
<div class="area_r">
<span class="num_text"><span class="sr_only">text_number</span><span class="num_count empty">0</span>/<span class="sr_only">total_text_number</span>600</span>
<button class="btn_g_ico btn_item secret_button " data-is-hidden=""><span class="ico_bbs ico_lock_state">secret_reply</span></button>
<div class="btn_group">
<button class="btn_g full_type1 confirm_button" style="font-size: 13px;">confirm</button>
</div>
</div>
</div>
</div>
</div>
I tried around 100ways but not work it...;(
I googled it also searched in stackoverflow
please please help this newbie
I struggled 3days already...:(

Jquery-ui selectable problems

I have a problem regarding jquery selectable , I have div that contains user information , this is my div
<div class="user-container" id="append_users">
<div class="fc-event draggable-user" ondblclick="sys.callUserProfile('+user.id+')" id="user_'+user.id+'"style="z-index: 9999;" onmousedown="sys.mouseDown()" onmouseup="sys.mouseLeave()">
<div class="container-fluid">
<input type="hidden" value="'+user.id+'" id="user_'+ user.id + '_value" class="userId">
<div class="row">
<div class="col-xs-3 avatar-col">
<img src="'+getUserImage(user.avatar)+'"width="100%">
</div>
<div class="col-xs-9 data-col">
<p class="fullName dataText" >'+user.fullName+'</p>
<p class="usr_Gender dataText" >Male</p>
<div style="position: relative"><li class="availableUnavailable"></li><li class="usr_profesion dataText" >AVAILABLE</li></div>
<p class="user_id" style="float:right;margin:3px">'+user.employee_id+'</p>
</div>
</div>
</div>
</div>
</div>
and I need the whole fc-event div to function as one , so the div with id="append_users" should contain the selectable class and the div with class fc-event should be considered as selection , I tried like this
( "#append_users" ).selectable();
but all childs take the ui-selectee class and it doesn't function at all, so what I want to do is the div with class fc-event should be considered as one, I hope i am clear, anyone please help

The documentation doesn't make it hugely clear, but from looking at the code and descriptions of the demos on the jQueryUI website (http://jqueryui.com/selectable/) it can be seen that the element you execute the "selectable" command against is intended to the container for the things you want to be selectable. It will automatically make all the child elements of that element into things which can be selectable. This is logical because generally you'd want to have several selectable items in a list and be able choose one or more items to select.
So if you want your "append_users" element to be selectable, you have to make the parent of that element the target of your "selectable" command. You haven't shown what the parent is, so for the purpose of example I'm going to assume it's just another <div>:
HTML:
<div id="selectable">
<div class="user-container" id="append_users">
<div class="fc-event draggable-user" id="user_1" style="z-index: 9999;">
<div class="container-fluid">
<input type="hidden" value="1" id="user_1_value" class="userId">
<div class="row">
<div class="col-xs-3 avatar-col">
<img src="https://i.imgur.com/db4KgSp.png" width="100px">
</div>
<div class="col-xs-9 data-col">
<p class="fullName dataText" >user.fullName</p>
<p class="usr_Gender dataText" >Male</p>
<div style="position: relative"><li class="availableUnavailable"></li><li class="usr_profesion dataText" >AVAILABLE</li></div>
<p class="user_id" style="float:right;margin:3px">user.employee_id</p>
</div>
</div>
</div>
</div>
</div>
</div>
JavaScript:
$("#selectable").selectable();
See http://jsfiddle.net/s6Lmy70b/2/ for a working demonstration.
(N.B. This is using very slightly adjusted markup compared to yours, just for demonstration and to make it easier to get it working, but the principle is the same regardless of the exact content being displayed)

I'm trying to float a <p> tag in a forum setup

I'm currently making a forum setup where users can view, post and respond to topics. The bit I'm posting here is the "reply to a topic bit". Where the top post is "Topic", and the "reply" bit is at the bottom. Inbetween I have "posted answers" to said Topic.
The problem I'm having is that the "p" tag wont position itself to the right of the user who posted his/her reply, like the replyfield at the bottom does.
I have tried to copy/paste the reply bit on top of each other, and they align nicely, but once I change the textarea tag to a p tag it wont work.
NOTE: The posts will later on be converted to actual posts using PHP, this is just for testing
Thanks
Here is the code:
HTML
<div class=forumListWrap>
<div class="col-1-forum">
<h2>TITLE</h2><!--TITLE-->
<button type="button" class="forumBtn">Add a Reply</button>
<div class="topic">
<h6>Topic</h6>
<div class="reply-wrap">
<div class="col-reply">
<div class="profilePicForum">
<img src="#">
</div>
<div class="profileInfoForum">
<h2>Username</h2>
<h3>Posts: 0</h3>
<h3>View Profile</h3>
</div>
</div>
<div class="col-3-reply">
<div class="postedAnswer">
<p>LOREM</p>
</div>
</div>
</div>
</div>
<div class="reply">
<div class="reply-wrap">
<div class="col-reply">
<div class="profilePicForum">
<img src="#">
</div>
<div class="profileInfoForum">
<h2>Username</h2>
<h3>Posts: 0</h3>
<h3>View Profile</h3>
</div>
</div>
<div class="col-3-reply">
<div class="postedAnswer">
<p>LOREM LOREM</p>
</div>
</div>
</div>
</div>
<div id="horiLine"></div>
<div class="col-2-reply">
<h2>Reply to thread</h2>
<div class="profilePicForum">
<img src="#">
</div>
<div class="profileInfoForum">
<h2>Username</h2>
<h3>Posts: 0</h3>
</div>
</div>
<div class="col-3-reply">
<div class="answerField">
<textarea></textarea>
</div>
<input id="replySubmit" type="submit" value="Submit">
</div>
</div>
</div>
Please see code.

See the updated jsFiddle for a possible Variant.
Explanation of what i did:
i set a width for the column with the username (col-3-reply) to 20% and also made it float left
i set the width of the reply-content to 80%
i added a antifloat div below. This is because floating elements are treated differently, and by adding this, you can have them still inside the box with the grey border of the reply.
Here are the antifloat CSS rules. See the jsFiddle for all details:
.antifloat {
height: 0;
width: 0;
clear: both;
}
As a general hint: Check out the new CSS 3 flexbox ( display:flex; ) it has very good support in all modern browser and is way easier to understand,write and read.

Page flickering in chrome - bootstrap & jquery conflict

I am having an issue of my webpage flickering/blinking randomly, this happens in chrome, I have not yet tested other browsers.
I figured that this issue should be due to bootstrap.js & jQuery.js conflict because if I remove one of these then it does not blink no more, it doesn't matter which one I remove.
I tryed to use the jquery-noConflict() method but either I don't know how to use it properly or it did not wok for me.
But removing both any of them is not an option because some of the websites features are not working then.
I have recorded how it looks while it flickers:
removed
It is hard for me to describe the problem when I am limited to uploading images and links as I am a new member of stackoverflow, as I can only post 2 links, I'll post the link of the website, so if anybody can help me they can look over the source code there freely - http://removed
I am using jquery-1.11.0.min.js and bootstrap.min.js
This is one of the blocks that flickers:
<section id="privalumai" class="container">
<div class="row">
<div class="col-md-12 title">
<h2>Privalumai</h2>
<span class="underline"> </span>
</div>
<!-- Service Box start -->
<div class="col-md-6">
<div class="service-box wow fadeInLeft" data-wow-offset="100">
<div class="service-icon">+</div>
<h3 class="service-title">Draudimas</h3>
<div class="clearfix"></div>
<p class="service-content">Visos mūsų transporto priemonės yra apdraustos tiek KASKO, tiek privalomuoju ( TPVCA ) draudimu. Kasko draudimo galiojimo teritorija – geografinė Europa, o TPVCA – „žaliosios kortelės“ sistemos ribose.
Jums pageidaujant, galime pasiÅ«lyti ir vykstanÄių į užsienį kompleksinį kelionÄ—s draudimÄ… ( pvz. vykstant slidinÄ—ti ir pan.)<br/><br/></p>
</div>
</div>
<!-- Service Box end -->
<!-- Service Box start -->
<div class="col-md-6">
<div class="service-box wow fadeInLeft" data-wow-offset="100">
<div class="service-icon">+</div>
<h3 class="service-title">Mobilumas</h3>
<div class="clearfix"></div>
<p class="service-content">Visos mūsų transporto priemonės yra naujos ir yra aprūpintos tiek pilna gamintojo garantija, tiek techninės pagalbos kelyje paslauga, todėl tiek avarijos ar techninio gedimo atveju Jums bus suteiktas pakaitinis automobilis ir pasirūpinta Jūsų kelionės pratęsimu.<br/><br/><br/></p>
</div>
</div>
<!-- Service Box end -->
<!-- Service Box start -->
<div class="col-md-6">
<div class="service-box wow fadeInRight" data-wow-offset="100">
<div class="service-icon">+</div>
<h3 class="service-title">Neribotas kilometrų kiekis</h3>
<div class="clearfix"></div>
<p class="service-content">Mes suprantame savo klientų poreikius, todėl neribojame jų nuvažiuoto kilometrų kiekio.<br/><br/></p>
</div>
</div>
<!-- Service Box end -->
<!-- Service Box start -->
<div class="col-md-6">
<div class="service-box wow fadeInRight" data-wow-offset="100">
<div class="service-icon">+</div>
<h3 class="service-title">Nauji automobiliai</h3>
<div class="clearfix"></div>
<p class="service-content">Mūsų transporto priemonės yra naujos ir sukomplektuotos taip, kad Jums būtų patogu ir lengva keliauti.<br/><br/></p>
</div>
</div>
<!-- Service Box end -->
</div>
</section>
I am really lost here and now sure how would I go about fixing this. I would really appreciate if somebody would point me at the right direction. If there aren't enough resources or anything else please comment and I will supply them and reply to all of your answers!

Does adding this to your flickering element solve it?
.flickeringElementFix {
-webkit-backface-visibility: hidden;
backface-visibility: hidden;
}
It could be that there's some element manipulation going on in one or both of your scripts that are arguing
http://www.w3schools.com/cssref/css3_pr_backface-visibility.asp

slideToggle different effect over different DIVs

When i click over the first DIV, the slideToggle effect is done correctly.
When i click over the 2nd one, it seems like it doesn't apply the effect and the content just appear suddenly.
The same occurs with the 3rd element and with any other one but the first.
What's going on?
(demo working here: http://jsfiddle.net/SW5sc/6/ )
I have this HTML structure:
<div class="subcategory">Option 1 </div>
<div class="subcategoryContent">
<div class="subcategoryOption">
<div class="image">
<img src="vista/imgs/grupales.gif" alt="Clases grupales" />
</div>
<div class="text">
TEXT
</div>
</div>
</div>
<div class="subcategory">Option 2</div>
<div class="subcategoryContent">
<div class="subcategoryOption">
<div class="image">
<img src="vista/imgs/grupales.gif" alt="Clases grupales" />
</div>
<div class="text">
TEXT
</div>
</div>
</div>
And this jQuery code:
$(".subcategory").click(function () {
$(this).next(".subcategoryContent").slideToggle(450).siblings(".subcategoryContent").slideUp(450);
return false;
});

Remove all the "float"-properties from the CSS, and it'll work just fine! :-) The floats ruin the animations..