I can't put a title to the page I tried to use the title tag again with no success.
the relevant code view:
<h2 align="left" class="w3-center">לוח מודעות</h2>
<tr align="left">
<div align="left" class="w3-content" style="max-width:400px">
<img align="left" class="mySlides" src="http://www.sapir.ac.il/files/7a790acebf3213f6928cb60fd488471a//styles/epsa_crop_hp_top_banner/public/030717_OPHW8.jpg?itok=dAGknih9" style="width:100%" height="450">
<img align="left" class="mySlides" src="http://cnd.ash-college.ac.il/.upload/Images/banner_500x251.jpg" style="width:100%" height="450">
<img align="left" class="mySlides" src="http://www.achva.ac.il/sites/default/files/imagecache/carousel_img/carousel/images/s-yom_new.jpg" style="width:100%" height="450">
</div>
</tr>
<br />
<br />
<button id="button1" style="background:#f90;
color:#fff;font-family:Calibri;
padding:6px 30px;border:none;
border-bottom:3px solid #925b08;
border-radius:10px;
font-size:200%;"
type="button"
onclick="location.href='#Url.Action("ShowSearch1","Institution")'">
חפש מוסד לימודים
</button>
<button id="button1" dir="rtl" style="background:#f90;
color:#fff;font-family:Calibri;
padding:6px 30px;border:none;
border-bottom:3px solid #925b08;
border-radius:10px;
font-size:200%;"
type="button"
onclick="location.href='#Url.Action("ShowSearch", "Degree")'">
חפש תואר
Related
I need put letters in a permanent site in a div like the next photo
as you can see I need to reduce the position of the letters
My code is this
<div class="col-md-4 col-xl-4 col-xs-4 col-sm-4 col-lg-4">
<div class="contenedor">
<center>
<h3>Helado de copoazú </h3>
</center>
<br />
<figure>
<img src="/as_website_sale_onepage/static/img/helado_copoazu.jpeg"
style="width: 100%;border-radius: 8px;" product_id='45' onmousemove="deshabilitar()"/>
<div class="centrado2" name="disponible_helado" id="agotado_45"></div>
</figure>
<center>
<div id="adiciona45_mostrar" style="font-weight:bold; font-size: 22px;">
Bs.
10
</div>
<button id="stepDown-helado" type="button" style="border-radius: 15px;"
class=" btn btn-success"
onclick="cambiar_inputs();" product_id='45'>-</button>
<input type="number" name="numero_helado" id="numero_helado" value="0"
min="0" readonly="1" size="3"
style="text-align: center;width:50px !important; border: 1px solid #97CCF3; color: #099EFB; font-weight: bold;border-radius: 15px;" />
<button id="stepUp-helado" type="button" style="border-radius: 15px;"
class=" btn btn-primary"
onclick="cambiar_inputs();" product_id='45'>+</button>
</center>
</div>
<hr style="border: 5px solid #1db33b; width:100%" />
</div>
How can i do that?
using css this is simple
div::after{
content: 'anyLetter';
}
or
div::before{
content: 'anyLetter';
}
Edit: if you want to add it in the around the location marked in the image,
i would suggest around the <h3> or the <figure> tags.
also adding a class like after-word would make it more usable
I need to select this input ...
(name="BtnNext" value="İLERİ" class="NavigationButtonNextLightBox ")
... with xpath after this modal popup. I cant use .FindByClass because there are same classes in the main page, but I need open which in (id="__LIGHTBOX__") modal;
<div style="overflow: visible; padding: 0px; width: auto; min-height: 143px; max-height: none; height: auto;" class="ui-dialog-content ui-widget-content" id="__LIGHTBOX__">
<div class="__BOX__">
<input name="BtnClose" class="BoxButtonClose" type="button">
<div>
<img src="/Content/themes/base/images/popup-bg-top.png">
</div>
<div class="popupCapsule clearFix">
<form action="/BillPayment/TransferInfo" method="post">
<div class="banner clearFix">
<h1 class="pageTitle">Fatura Ödeme</h1>
</div>
<div class="relatedPeopleContainer clearFix">
<div class="topDiv">
</div>
<div class="relatedPeople clearFix">
<table>
<tbody>
<tr>
<td class="t1">
<img src="Content/banks/bank205.png">
</td>
<td class="t2 SenderReceiverSubmit" rowspan="2" style="cursor: pointer;">
<div class="arrow">
</div>
</td>
<td class="t3">
<img src="Content/company/Turkcell.png">
</td>
</tr>
<tr>
<td class="t4">
<div class="info right">
<h2 class="NavigationButtonIndex" style="cursor: pointer;" title="Hesabınızı değiştirmek için tıklayınız.">HESABIM
<img src="/Content/themes/base/images/change-account.png" alt="" style="height: 20px; vertical-align: text-bottom;">
</h2>
<p class="first">
Beşyüzevler Şube
</p>
<p>
Cari Hesap
</p>
<p>
10136046-1
</p>
<p>
1.256,51 TL
</p>
</div>
</td>
<td class="t6">
<div class="info left">
<h2>TURKCELL
</h2>
<p class="first">
1774862559
</p>
<p>
5303003816
</p>
<p>
23,40 TL
</p>
</div>
</td>
</tr>
</tbody>
</table>
</div>
<div class="bottomDiv">
</div>
</div>
<div class="amountEntry clearFix">
<table class="moneyEditorTable ">
<tbody>
<tr>
<td>
<input class="integerinput " data-val="true" data-val-regex="The field Integer must match the regular expression '[0-9.,]{1,11}'." data-val-regex-pattern="[0-9.,]{1,11}" datavalrequired="" disabled="disabled" id="IntegerInput" name="Amount.Integer" onkeyup=";" value="23" type="text"></td>
<td class="spanTd">
<span class="currency ">,</span>
</td>
<td>
<input maxlength="2" class="decimalinput " data-val="true" data-val-range="The field Decimal must be between 0 and 99." data-val-range-max="99" data-val-range-min="0" datavalrequired="" disabled="disabled" id="DecimalInput" name="Amount.Decimal" onkeypress="return BOA.Web.Validation.NumericControl(event);" onkeyup=";BOA.Web.Validation.DecimalPoint(event, $(this));" onpaste="BOA.Web.Validation.NumericEditorPaste(event, $(this));" value="40" type="text"></td>
<td class="spanTd">
<span class="currency ">TL</span>
</td>
</tr>
</tbody>
</table>
<input id="Amount_FECCode" name="Amount.FECCode" value="TL" type="hidden">
<div class="Error clearFix">
<span class="field-validation-valid" data-valmsg-for="Amount" data-valmsg-replace="true"></span>
</div>
</div>
<table class="popupButtonArea">
<tbody>
<tr>
<td class="left">
<input name="BtnPrev" value="GERİ" class="NavigationButtonPrev " type="button">
</td>
<td class="right">
<input name="BtnNext" value="İLERİ" class="NavigationButtonNextLightBox " type="button">
<input name="FromStep" value="TransferInfo" type="hidden">
</td>
</tr>
</tbody>
</table>
<input name="__RequestVerificationToken" value="jzI4c0v-PPC60xzaY8B2FDiCLYmHwCCtQsYv7UbBIMgnBWFeEpJoLLMDgf4LGl24WxhfizGlsqEJdjhywzgNHT785XHRzmwcU2qDyaQfSh6SajD8WKCAEq2L8CejPMJ65QL45A2" type="hidden">
</form>
</div>
<div>
<img src="/Content/themes/base/images/popup-bg-sub.png">
</div>
</div>
</div>
You can try to find the element by the following xpath :
//div[contains(#id, 'LIGHTBOX')]//input[#name='BtnNext' and contains(#class, 'NavigationButtonNextLightBox')]
Above xpath attempt to find a <div> having id contains LIGHTBOX, then from within that <div> get <input> element having name attribute equals BtnNext and class attribute contains NavigationButtonNextLightBox
Not sure am i missing somehting here, but whats stopping you from selecting by name?
WebElement btnNext = driver().findElement(By.name("BtnNext"));
I am working on my portfolio right now and therefore I want to include several slideshows which are controlled via keyboard. I am working with this code right now and the slideshow works fine. My problem is now that both slideshows are selected at the same time and not only the one which is visible on screen.
How do I activate / deactivate the slideshow which the user sees?
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
<title></title>
<style type="text/css">
#SS {
position:relative;
margin-left: auto;
margin-right: auto;
top:100px;
width:600px;
height:600px;
}
#SS2 {
position:relative;
margin-left: auto;
margin-right: auto;
top:100px;
width:600px;
height:600px;
}
</style></head>
<body>
<input type="button" name="" value="Back" onmouseup="Slideshow.next('SS',-1);" />
<input type="button" name="" value="Next" onmouseup="Slideshow.next('SS',1);" />
<div id="SS" >
<img width="600" height="600" src="http://www.ignant.de/wp-content/uploads/2014/04/Witchoria_Landscapes_01.jpg" class="thumb" />
<br />
<img width="600" height="600" src="http://www.ignant.de/wp-content/uploads/2014/04/Witchoria_Landscapes_04.jpg" class="thumb" />
<br />
<img width="600" height="600" src="http://www.ignant.de/wp-content/uploads/2014/04/Witchoria_Landscapes_05.jpg" class="thumb" />
<br />
<img width="600" height="600" src="http://www.ignant.de/wp-content/uploads/2014/04/Witchoria_Landscapes_06.jpg" class="thumb" />
<br />
<img width="600" height="600" src="http://www.ignant.de/wp-content/uploads/2014/04/Witchoria_Landscapes_07.jpg" class="thumb" />
<br />
<img width="600" height="600" src="http://www.ignant.de/wp-content/uploads/2014/04/Witchoria_Landscapes_08.jpg" class="thumb" />
</div>
<input type="button" name="" value="Back" onmouseup="Slideshow.next('SS2',-1);" />
<input type="button" name="" value="Next" onmouseup="Slideshow.next('SS2',1);" />
<div id="SS2" >
<img width="600" height="600" src="http://www.ignant.de/wp-content/uploads/2014/04/Witchoria_Landscapes_01.jpg" class="thumb" />
<br />
<img width="600" height="600" src="http://www.ignant.de/wp-content/uploads/2014/04/Witchoria_Landscapes_04.jpg" class="thumb" />
<br />
<img width="600" height="600" src="http://www.ignant.de/wp-content/uploads/2014/04/Witchoria_Landscapes_05.jpg" class="thumb" />
<br />
<img width="600" height="600" src="http://www.ignant.de/wp-content/uploads/2014/04/Witchoria_Landscapes_06.jpg" class="thumb" />
<br />
<img width="600" height="600" src="http://www.ignant.de/wp-content/uploads/2014/04/Witchoria_Landscapes_07.jpg" class="thumb" />
<br />
<img width="600" height="600" src="http://www.ignant.de/wp-content/uploads/2014/04/Witchoria_Landscapes_08.jpg" class="thumb" />
</div>
<script type="text/javascript">
/*<![CDATA[*/
var Slideshow={
init:function(id){
var obj=document.getElementById(id),imgs=obj.getElementsByTagName('IMG'),z0=0,clone;
Slideshow[id]={};
Slideshow[id].obj=obj;
Slideshow[id].ary=[];
Slideshow[id].cnt=0;
for (;z0<imgs.length;z0++){
imgs[z0].style.position='absolute';
imgs[z0].style.left=(z0>0?-3000:(obj.offsetWidth-imgs[z0].width)/2)+'px';
imgs[z0].style.top=(obj.offsetHeight-imgs[z0].height)/2+'px';
clone=document.createElement('IMG');
clone.src=imgs[z0].src;
clone.style.position='absolute';
clone.style.zIndex='101';
clone.style.left='-3000px';
document.body.appendChild(clone);
Slideshow[id].ary[z0]=[imgs[z0],clone];
// Slideshow.addevt(imgs[z0],'mouseover','pop',id,z0);
Slideshow.addevt(clone,'mouseout','hide');
}
Slideshow.addevt(document,'keyup','keycode',id);
Slideshow.lst=clone;
},
next:function(id,ud){
Slideshow.hide();
var oop=Slideshow[id],obj=oop.obj,cnt=oop.cnt+ud,lgth=oop.ary.length-1,img;
oop.ary[oop.cnt][0].style.left='-3000px';
cnt=cnt<0?lgth:cnt==lgth?0:cnt;
img=oop.ary[cnt][0];
img.style.left=(obj.offsetWidth-img.width)/2+'px';
img.style.top=(obj.offsetHeight-img.height)/2+'px';
oop.cnt=cnt;
},
keycode:function(id,nu,e){
Slideshow.hide();
var kk;
if (e.which){
kk=e.which;
}
else {
kk=e.keyCode;
}
if (kk==37||kk==39){
Slideshow.next(id,kk==37?-1:1);
}
},
pop:function(id,nu){
Slideshow.hide();
var oop=Slideshow[id],pos=Slideshow.pos(oop.obj),clone=oop.ary[nu][1];
clone.style.left=(oop.obj.offsetWidth-clone.width)/2+pos[0]+'px';
clone.style.top=(oop.obj.offsetHeight-clone.height)/2+pos[1]+'px';
Slideshow.lst=clone;
},
hide:function(){
Slideshow.lst.style.left='-3000px';
},
pos:function(obj){
var rtn=[0,0];
while(obj){
rtn[0]+=obj.offsetLeft;
rtn[1]+=obj.offsetTop;
obj=obj.offsetParent;
}
return rtn;
},
addevt:function(o,t,f,id,p){
if (o.addEventListener) o.addEventListener(t,function(e){ return Slideshow[f](id,p,e);}, false);
else if (o.attachEvent) o.attachEvent('on'+t,function(e){ return Slideshow[f](id,p,e); });
}
}
Slideshow.init('SS')
Slideshow.init('SS2')
/*]]>*/
</script></body>
</html>
I have a styling problem
I am trying to align a button with the first column of a gridview which is right underneath.
Something like this:
I've done the following but obviously it will fail with different resolutions:
<div class="formsFormBlock">
<asp:Label ID="LblRecurError" runat="server" />
<div style="text-align: left; position: relative; left: -15%;">
<table style="border: 0">
<tr>
<td style="border: 0">
<asp:Button ID="btnRecur" runat="server" Text="Repeat" />
</td>
</tr>
</table>
</div>
<asp:GridView>
</asp:GridView>
How can i do this?
Addition:
the gridview doesn't have a cssclass but the div above has the following css attributes:
.formsFormBlock{clear:both;position:relative;border-bottom:1px solid #e8f1f7;padding:0.53em 0.83em}
.formsFormBlock .formsItemLabel{display:block;width:25%;float:left;position:relative}
.formsFormBlock .formsItemLabel em{position:absolute;/*right:1.66em*/color:#ff0000}
.formsFormBlock .formsFormBlockHint{color:#999;font-size:92%;}
#formsFormHd:after, .formsFormBlock:after{content:".";display:block;height:0;clear:both;visibility:hidden;}
#formsFormHd, .formsFormBlock{display:block;clear:both;}
*:first-child+html #formsFormHd, *:first-child+html .formsFormBlock{display:inline-block;}
Try this
<div class="formsFormBlock">
<div style="text-align: left; position: relative; left: -15%;">
<table style="border: 0">
<tr>
<td style="border: 0">
<asp:Button ID="btnRecur" runat="server" Text="Repeat" />
<asp:Label ID="LblRecurError" runat="server" />
</td>
</tr>
</table>
</div>
<asp:GridView>
</asp:GridView>
<div id="container">
<div style="float: left; margin-bottom: 10px;">
<asp:Label ID="LblRecurError" runat="server" />
<br />
<asp:Button ID="btnRecur" runat="server" Text="Repeat" />
</div>
<div style="clear: left;">
<asp:GridView runat="server">
</asp:GridView>
</div>
</div>
cheers
I have a table which I'm going to try to represent this way:
-------------------------
| L1 | R1 |
------------------------
| L2 | R2 |
-------------------------
My code is as follows:
<div data-role="content" id="div1" align="top" style="padding:3 !important;" >
<table border="0" align="CENTER" cellspacing="0" width="100%" style="vertical- align: text-bottom;" >
<tr>
<td></td>
<td>
<div id="question1" class="question">
<input type="text" id="question" />
<Style>
#question{
font:5px;
font-family:verdana;
}
</style>
</div>
</td></tr><tr>
<td width="50"><img id="img2" width="40" height="36" style="float:right; margin-top: 0px;" ></td>
<td style="text-align:center;">
<div class="ui-grid-b" >
<div class="ui-block-a"><button id="button1" type="submit" data-theme="b" style="font-size:0.8em;"></button></div>
<div class="ui-block-b"><button id="button2" type="submit" data-theme="b" style="font-size:0.8em;"></button></div>
<div class="ui-block-c"><button id="button3" type="submit" data-theme="b" style="font-size:0.8em;"></button></div>
</div>
</td>
</tr>
</table>
</div>
So basically what I'm trying to do is, there is no section L1 in my table. R1 has data and so has R2. There is an image in L2. What I'm trying to do is remove the division between L1 and L2 and the image in L2 should be centered on the table and not just in the TD for L2. How do I do that?
Also the other question I have is, in the following line of code:
<input type="text" id="question" />
when the value is populated and when I view this in a mobile, the text sometimes goes to the next line. I thought textarea was the only HTML tag which has multiline. Not sure why the text here is going multi-line and how do I avoid it?
See this bit just under <table border="0"....
<tr><td></td>
Change that to
<tr>
<td width="50" rowspan="2">
<img id="img2" width="40" height="36" style="float:right; margin-top: 0px;">
</td>
And then get rid of the <td></td> that originally held that image.