I have made a website and in a part of it, I want to output reviews that are stored on a database onto the page. This works and all the data is outputted, but every new entry is shifted to the right to the one above.
(see image below)
This image shows the problem
This is the code responsible to output the data:
<%
for(int i = (int) request.getAttribute("evalsize") - 1; i >= 0 ; i--)
{
Evaluation eval = (Evaluation) request.getAttribute("eval"+i);
%>
<div class="clearfix colelem" id="u18704"><!-- group -->
<div class="clearfix grpelem" id="u18698"><!-- group -->
<!-- m_editable region-id="editable-static-tag-U18683-BP_infinity" template="show-hotel-proper.html" data-type="html" data-ice-options="disableImageResize,link,txtStyleTarget" -->
<div class="clearfix grpelem" id="u18683-4" data-muse-uid="U18683" data-muse-type="txt_frame" data-IBE-flags="txtStyleSrc"><!-- content -->
<p><%= eval.getDateStart() %> - <%= eval.getDateEnd() %></p>
</div>
<!-- /m_editable -->
<!-- m_editable region-id="editable-static-tag-U18686-BP_infinity" template="show-hotel-proper.html" data-type="html" data-ice-options="disableImageResize,link,txtStyleTarget" -->
<div class="clearfix grpelem" id="u18686-4" data-muse-uid="U18686" data-muse-type="txt_frame" data-IBE-flags="txtStyleSrc"><!-- content -->
<p><%= eval.getMessage() %></p>
</div>
<!-- /m_editable -->
<!-- m_editable region-id="editable-static-tag-U18689-BP_infinity" template="show-hotel-proper.html" data-type="html" data-ice-options="disableImageResize,link,txtStyleTarget" -->
<div class="clearfix grpelem" id="u18689-4" data-muse-uid="U18689" data-muse-type="txt_frame" data-IBE-flags="txtStyleSrc"><!-- content -->
<p><%= eval.getStarsHotel()%></p>
</div>
<!-- /m_editable -->
<!-- m_editable region-id="editable-static-tag-U18695-BP_infinity" template="show-hotel-proper.html" data-type="html" data-ice-options="disableImageResize,link,txtStyleTarget" -->
<div class="clearfix grpelem" id="u18695-4" data-muse-uid="U18695" data-muse-type="txt_frame" data-IBE-flags="txtStyleSrc"><!-- content -->
<p><%= eval.getStarsActivities()%></p>
</div>
<!-- /m_editable -->
</div>
<div class="grpelem" id="u18701"><!-- simple frame --></div>
<%}
%> </div><%
}%>
I would appreciate it enormously, if someone could help me make sure each database result is below another.
check your div elements. I think you have an extra one before this one
<div class="grpelem" id="u18701"><!-- simple frame --></div>
Related
I'm trying to add navigation arrows to my product quickview page on Shopify instead of having to drag the images up/down which I've come to realise many of my customers do not get. I will appreciate any help I can get.
I believe the code responsible from the asset is the 'sca-quick-view-template.liquid'. I'm attaching the code in the sca-quick-view-template.liquid below
<div id="sca-qv-showqv" class="sca-bm" style="display: none !important;">
<div>
<!--START PRODUCT-->
<div class="quick-view-container fancyox-view-detail">
<div id="sca-qv-left" class="sca-left">
<div id="sca-qv-sale" class="sca-qv-sale sca-qv-hidden">Sale</div>
<!-- START ZOOM IMAGE-->
<div class="sca-qv-zoom-container">
<div class="zoomWrapper">
<div id="sca-qv-zoomcontainer" class='sqa-qv-zoomcontainer'>
<!-- Main image ! DON'T PUT CONTENT HERE! -->
</div>
</div>
</div>
<!-- END ZOOM IMAGE-->
<!-- START GALLERY-->
<div id="sca-qv-galleryid" class="sca-qv-gallery">
<!-- Collection of image ! DON'T PUT CONTENT HERE!-->
</div>
<!-- END GALLERY-->
</div>
<!--START BUY-->
<div id ="sca-qv-right" class="sca-right">
<!-- -------------------------- -->
<div id="sca-qv-title" class="name-title" >
<!-- Title of product ! DON'T PUT CONTENT HERE!-->
</div>
<!-- -------------------------- -->
<div id ="sca-qv-price-container" class="sca-qv-price-container" >
<!-- price information of product ! DON'T PUT CONTENT HERE!-->
</div>
<!-- -------------------------- -->
<div id="sca-qv-des" class="sca-qv-row">
<!-- description of product ! DON'T PUT CONTENT HERE!-->
</div>
<!-- -------------------------- -->
<div class="sca-qv-row">
<a id="sca-qv-detail" href="" > View full product details → </a>
</div>
<!-- ----------------------------------------------------------------------- -->
<div id='sca-qv-cartform'>
<form id="sca-qv-add-item-form" method="post">
<!-- Begin product options ! DON'T PUT CONTENT HERE!-->
<div class="sca-qv-product-options">
<!-- -------------------------- -->
<div id="sca-qv-variant-options" class="sca-qv-optionrow">
<!-- variant options of product ! DON'T PUT CONTENT HERE!-->
</div>
<!-- -------------------------- -->
<div class="sca-qv-optionrow">
<label>Quantity</label>
<input id="sca-qv-quantity" min="1" type="number" name="quantity" value="1" />
</div>
<!-- -------------------------- -->
<div class="sca-qv-optionrow">
<p id="sca-qv-unavailable" class="sca-sold-out sca-qv-hidden">Unavailable</p>
<p id="sca-qv-sold-out" class="sca-sold-out sca-qv-hidden">Sold Out</p>
<input type="submit" class="sca-qv-cartbtn sca-qv-hidden" value="ADD TO CART" />
</div>
<!-- -------------------------- -->
</div>
<!-- End product options -->
</form>
</div>
</div>
<!--END BUY-->
</div>
<!--END PRODUCT-->
</div>
</div>
<div id="scaqv-metadata"
autoconfig = "yes"
noimage = "{{ 'sca-qv-no-image.jpg' | asset_url }}"
moneyFormat = '{{ shop.money_format }}'
jsondata = "{{ shop.metafields.sca-np-qv.settings }}" ></div>
Okay so, This error is keep on popping up and I don't understand why am I getting this error at all? I know there are some reserved words for contactform-7 but hey I changed everything to your now what?
<div id="form" method="post" your-name="send">
<!-- col start -->
<div class="col-sm-6 col-md-6 col-lg-6">
[text* name id:your-name class:requiredField class:your-name placeholder "Your Name"]
</div>
<!-- col end -->
<!-- col start -->
<div class="col-sm-6 col-md-6 col-lg-6">
[email* email id:your-email class:requiredField class:your-email placeholder "Email"]
</div>
<!-- col end -->
<!-- col start -->
<div class="make-space">
[text* subject id:your-subject class:requiredField class:your-subject placeholder "Subject"]
</div>
<!-- col end -->
<!-- col start -->
<div class="make-space">
[textarea* message class:requiredField class:your-message placeholder "Message"]
</div>
<!-- col end -->
<div>
<!-- button start -->
<div class="more-wraper more-wraper-form">
<div class="more-button">
[submit class:more-button-wrapper "Submit"]
</div>
</div>
<!-- button end -->
</div>
</div>
Unavailable names ("name") are used for form controls. Please help me out will ya?
I feel a bit silly posting this, since I've been working on this code for a bit and have run into this problem before, but in trying to clean up this project I removed/misplaced something and now my blog layout will not behave the way I want it to. I have two divs, one acting as the main container div, and another one inside that div for the actual blog entries. I'm almost sure it's a missing tag, but no matter where I place the closing tag, it doesn't look like what it initially did, so now I'm not entirely sure. The closest I get it almost ends up looking normal, but the embedded media content and tags do not appear. Here is my html markup; I can't figure it out for the life of me. Thanks in advance.
<!-- MAIN BLOG CONTAINER -->
<div class="pc">
{block:Posts}
<!-- POSTNOTES -->
<div class="pnc">
{block:Date}
{DayOfMonth} {ShortMonth} {ShortYear}
{block:NoteCount}{NoteCountWithLabel}{/block:NoteCount}
{block:RebloggedFrom}
source
{/block:RebloggedFrom}
{/block:Date}
</div>
<!-- END OF POSTNOTES -->
<!-- PERMALINK -->
{block:PermalinkPage}
{block:PostNotes}{PostNotes}{/block:PostNotes}
{/block:PermalinkPage}
<!-- END OF PERMALINK -->
<!-- POST TITLE CONTAINER -->
{block:Title}
<div class="ptc">
<div class="pt">{Title}</div>
</div>
{/block:Title}
<!-- END OF POST TITLE CONTAINER -->
<!-- INSIDE OF POSTS -->
<div class="posts">
{block:Text}
{Body}
{/block:Text}
</div>
<!-- PHOTOS -->
<!-- SINGLE PHOTO -->
{block:Photo}
<center>
<div style="margin-top:10px"></div>
<img src="{PhotoURL-250}" alt="{PhotoAlt}">
</center>
{block:Caption}{Caption}{/block:Caption}{
/block:Photo}
<!-- END OF SINGLE PHOTO -->
<!-- PHOTOSET -->
{block:Photoset}
<div style="margin-top:10px"></div>
<center>{Photoset-250}</center>
{block:Caption}{Caption}{/block:Caption}
{/block:Photoset}
<!-- END OF PHOTOSET -->
<!-- PANAROMA -->
{block:Panorama}
{LinkOpenTag}
<img src="{PhotoURL-Panorama}" alt="{PhotoAlt}"/>
{LinkCloseTag}
{block:Caption}{Caption}{/block:Caption}
{/block:Panorama}
<!-- END OF PANAROMA -->
<!-- ASKS -->
{block:Answer}
<img src="{AskerPortraitURL-64}">
{Asker}:
{Question}
{Answer}
{/block:Answer}
<!-- END OF ASKS -->
<!-- VIDEOS -->
{block:Video}
<center>
<div style="margin-top:10px"></div>
{Video-250}
</center>
{block:Caption}{Caption}{/block:Caption}
{/block:Video}
<!-- END OF VIDEOS -->
<!-- QUOTES -->
{block:Quote}
{Quote}
{block:Source}
<div class="source">{Source}</div>
{/block:Source}
{/block:Quote}
<!-- END OF QUOTES -->
<!-- LINKS -->
{block:Link}
<a href="{URL}" {Target}>{Name}</a>
{block:Description}{Description}{/block:Description}
{/block:Link}
<!-- LINKS -->
<!-- CHAT -->
{block:Chat}
{block:Title}{Title}{/block:Title}
{block:Lines}
{block:Label}{Label}{/block:Label}
{Line}
{/block:Lines}
{/block:Chat}
<!-- END OF CHAT -->
<!-- AUDIO -->
{block:Audio}
<div style="margin-top:10px;"></div>
<center>
{AudioPlayerWhite}
{block:AlbumArt}<img src="{AlbumArtURL}">{/block:AlbumArt}
<p>{block:TrackName}{TrackName}{/block:TrackName}</br>
{block:Artist} {Artist}{/block:Artist}</br>
</center>
{block:Caption}{Caption}{/block:Caption}
{/block:Audio}
<!-- END OF AUDIO -->
</div>
<!-- TAGS -->
<div class="tc">
<div class="tags">
{block:Tags}
* {Tag}
{/block:Tags}
</div>
</div>
<!-- END OF TAGS -->
{/block:Posts}
</div>
<!-- END OF MAIN BLOG CONTAINER -->
</body>
</html>
UPDATE Figured as much; it was an open bracket from one of the blocks. I had accidentally indented it, thus creating an open space, and it messed up the entire layout:
<!-- PHOTOS -->
<!-- SINGLE PHOTO -->
{block:Photo}
<center>
<div style="margin-top:10px"></div>
<img src="{PhotoURL-250}" alt="{PhotoAlt}">
</center>
{block:Caption}{Caption}{/block:Caption}{
/block:Photo}
<!-- END OF SINGLE PHOTO -->
I have a counter in my html code. I want to align this counter in the middle of the site. There is a helper class, called text-align which works with almost all objects on the site but i don't know how to align a script entry.
My code looks like this:
<section class="wow fadeIn">
<div class="container-fluid full-screen position-relative no-padding no-transition" >
<div class="opacity-medium bg-white"></div>
<div id="animated-balls"></div>
<div class="slider-typography xs-position-inherit">
<div class="slider-text-middle-main">
<div class="slider-text-top slider-text-middle2">
<!-- logo -->
<div class="coming-soon-logo"><img class="logo-style-2" src="images/offene-stadt.png" alt=""/></div>
<!-- end logo -->
<span class="coming-soon-title text-uppercase gray-text margin-ten no-margin-lr no-margin-bottom">We're getting ready to launch</span>
<!-- time -->
<div id="counter-underconstruction2" class="white-text text-center margin-two no-margin-lr no-margin-bottom"></div>
<div id="countdown-target" class="text-center"></div>
<script>
var myCountdown1 = new Countdown({time:86400*20});
</script>
</div>
<!-- end time -->
You can set a target to point it at a specific item so try this:
<div class="slider-text-top slider-text-middle2">
<!-- logo -->
<div class="coming-soon-logo"><img class="logo-style-2" src="images/logo-light-big.png" alt=""/></div>
<!-- end logo -->
<span class="coming-soon-title text-uppercase gray-text margin-ten no-margin-lr no-margin-bottom">We're getting ready to launch</span>
<!-- time -->
<div id="counter-underconstruction2" class="white-text text-center margin-two no-margin-lr no-margin-bottom"></div>
<i class="icon-anchor medium-icon"></i>
<div id="countdownTarget" class="center-block"></div>
<script>
var myCountdown1 = new Countdown({time:316, target: "countdownTarget"});
</script>
<!-- end time -->
</div>
And then use your existing text-align technique on the #countdownTarget to position it how you like.
I need to click on the link that says "Customer One". Currently I am using
//div[contains(#class,'client-info') and contains(div/text(),'Customer')]
Using Firepath, this returns four seperate elements (I have attached code that includes two of them), and I think that is why Selenium Webdriver is unable to find the element I would like to click.
I Need to click the very last instance of this xpath, but it doesn't appear possible to be any more specific, as they have the same class and inner text!
<div class="wg-client-row-mobile hidden-sm hidden-md hidden-lg">
<div class="row">
<div class="col-xs-11">
<span class="icon icon-user" ng-class="{'icon-user': !wgClientItemCtrl.client.isAnOrganization, 'icon-business': wgClientItemCtrl.client.isAnOrganization}"/>
<div class="client-info">
<div class="client-name not-long-text ng-binding">Customer One</div>
<!-- <div class="client-age not-long-text" ng-if="!wgClientItemCtrl.client.isAnOrganization">{{wgClientItemCtrl.client.gender}}, {{wgClientItemCtrl.client.calculatedAge | notAvailable}}</div> -->
<!-- ngIf: !wgClientItemCtrl.client.isAnOrganization -->
<div class="client-age not-long-text ng-binding ng-scope" ng-if="!wgClientItemCtrl.client.isAnOrganization">
<!-- end ngIf: !wgClientItemCtrl.client.isAnOrganization -->
<!-- ngIf: wgClientItemCtrl.client.isAnOrganization -->
<div class="client-age not-long-text ng-binding">
</div>
</div>
<div class="favorite-right-container">
</div>
</div>
<div class="wg-client-row-desktop hidden-xs hidden-is">
<div class="row content">
<div class="col-sm-4">
<div class="icon icon-user" ng-class="{'icon-user': !wgClientItemCtrl.client.isAnOrganization, 'icon-business': wgClientItemCtrl.client.isAnOrganization}"/>
<div class="client-info">
<div class="client-name not-long-text ng-binding">Customer One</div>
</div>
You can use last() to get the last instance matched by the inner XPath :
(//div[contains(#class,'client-info') and contains(div/text(),'Customer')])[last()]