demo-spa broken layout on windows by default

4 replies·opened Feb 24, 2020
S
stookyFeb 24, 2020

I think I found the problem

in demo.spa.html

				<div class="section nomargin clearfix" style="background: #FFF url('demos/spa/images/others/2.jpg') no-repeat top left;">

					<div class="container clearfix">
						<div class="row">
							<div class="col-lg-7 offset-lg-5">
								<div class="heading-block noborder bottommargin-sm">
									<h3>Beautiful Service.</h3>
								</div>

the third line div class row is spanning also the 3 featureboxes below with the round images
when this row is spanning only the upper block and closed afterwards and not closed after spanning also the blocks below it seems to work !!!

please check and verify

rgds
guido

S
SemiColonWebSTAFFFeb 24, 2020

Hello,

Ohh My! That is a Stupid Stupid Mistake! We Really Apologize about the Inconveniences caused!

This should be right code:

<div class="section nomargin clearfix" style="background: #FFF url(&apos;demos/spa/images/others/2.jpg&apos;) no-repeat top left;">

&#x9;<div class="container clearfix">
&#x9;&#x9;<div class="row">
&#x9;&#x9;&#x9;<div class="col-lg-7 offset-lg-5">
&#x9;&#x9;&#x9;&#x9;<div class="heading-block noborder bottommargin-sm">
&#x9;&#x9;&#x9;&#x9;&#x9;<h3>Beautiful Service.</h3>
&#x9;&#x9;&#x9;&#x9;</div>

&#x9;&#x9;&#x9;&#x9;<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Ullam cupiditate, libero pariatur aliquam vitae deserunt esse assumenda, tenetur veritatis, nihil consectetur facilis!</p>

&#x9;&#x9;&#x9;&#x9;<div class="col_one_third center topmargin-sm">
&#x9;&#x9;&#x9;&#x9;&#x9;<i class="spa-leaves i-plain i-large divcenter nobottommargin" style="color: #D2D2D2;"></i>
&#x9;&#x9;&#x9;&#x9;&#x9;<div class="counter ls1 t600" style="color: #777; margin-top: 10px;"><span data-from="10" data-to="21" data-refresh-interval="50" data-speed="2000"></span></div>
&#x9;&#x9;&#x9;&#x9;&#x9;<h5>Spa Branches</h5>
&#x9;&#x9;&#x9;&#x9;</div>

&#x9;&#x9;&#x9;&#x9;<div class="col_one_third center topmargin-sm">
&#x9;&#x9;&#x9;&#x9;&#x9;<i class="spa-woman i-plain i-large divcenter nobottommargin" style="color: #D2D2D2;"></i>
&#x9;&#x9;&#x9;&#x9;&#x9;<div class="counter ls1 t600" style="color: #777; margin-top: 10px;"><span data-from="100" data-to="8514" data-refresh-interval="50" data-speed="2500"></span></div>
&#x9;&#x9;&#x9;&#x9;&#x9;<h5>Employees</h5>
&#x9;&#x9;&#x9;&#x9;</div>

&#x9;&#x9;&#x9;&#x9;<div class="col_one_third col_last center topmargin-sm">
&#x9;&#x9;&#x9;&#x9;&#x9;<i class="spa-meditation i-plain i-large divcenter nobottommargin" style="color: #D2D2D2;"></i>
&#x9;&#x9;&#x9;&#x9;&#x9;<div class="counter ls1 t600" style="color: #777; margin-top: 10px;"><span data-from="100" data-to="458" data-refresh-interval="50" data-speed="3500"></span></div>
&#x9;&#x9;&#x9;&#x9;&#x9;<h5>Happy Clients</h5>
&#x9;&#x9;&#x9;&#x9;</div>
&#x9;&#x9;&#x9;</div>

&#x9;&#x9;&#x9;<div class="w-100"></div>

&#x9;&#x9;&#x9;<div class="col-md-4 bottommargin-sm center">
&#x9;&#x9;&#x9;&#x9;<div class="feature-box media-box">
&#x9;&#x9;&#x9;&#x9;&#x9;<div class="fbox-media" style="padding: 0 40px;">
&#x9;&#x9;&#x9;&#x9;&#x9;&#x9;<a href="#"><img class="rounded-circle img-thumbnail" src="demos/spa/images/services/1.jpg" alt="Why choose Us?"></a>
&#x9;&#x9;&#x9;&#x9;&#x9;</div>
&#x9;&#x9;&#x9;&#x9;&#x9;<div class="fbox-desc">
&#x9;&#x9;&#x9;&#x9;&#x9;&#x9;<h3>Beauty.<span class="subtitle cookie-font">Your Property in Good Hands.</span></h3>
&#x9;&#x9;&#x9;&#x9;&#x9;&#x9;<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Eligendi rem, facilis nobis voluptatum est voluptatem accusamus molestiae eaque perspiciatis mollitia.</p>
&#x9;&#x9;&#x9;&#x9;&#x9;</div>
&#x9;&#x9;&#x9;&#x9;&#x9;<a href="#" class="button button-rounded" style="margin: 20px 0 0 0;">Read More</a>
&#x9;&#x9;&#x9;&#x9;</div>
&#x9;&#x9;&#x9;</div>

&#x9;&#x9;&#x9;<div class="col-md-4 bottommargin-sm center">
&#x9;&#x9;&#x9;&#x9;<div class="feature-box media-box">
&#x9;&#x9;&#x9;&#x9;&#x9;<div class="fbox-media" style="padding: 0 40px;">
&#x9;&#x9;&#x9;&#x9;&#x9;&#x9;<a href="#"><img class="rounded-circle img-thumbnail" src="demos/spa/images/services/2.jpg" alt="Effective Planning"></a>
&#x9;&#x9;&#x9;&#x9;&#x9;</div>
&#x9;&#x9;&#x9;&#x9;&#x9;<div class="fbox-desc">
&#x9;&#x9;&#x9;&#x9;&#x9;&#x9;<h3>Spa.<span class="subtitle cookie-font">Construction Process Organized.</span></h3>
&#x9;&#x9;&#x9;&#x9;&#x9;&#x9;<p>Porro repellat vero sapiente amet vitae quibusdam necessitatibus consectetur, labore totam. Accusamus perspiciatis asperiores labore esse.</p>
&#x9;&#x9;&#x9;&#x9;&#x9;</div>
&#x9;&#x9;&#x9;&#x9;&#x9;<a href="#" class="button button-rounded" style="margin: 20px 0 0 0;">Read More</a>
&#x9;&#x9;&#x9;&#x9;</div>
&#x9;&#x9;&#x9;</div>

&#x9;&#x9;&#x9;<div class="col-md-4 bottommargin-sm center">
&#x9;&#x9;&#x9;&#x9;<div class="feature-box media-box">
&#x9;&#x9;&#x9;&#x9;&#x9;<div class="fbox-media" style="padding: 0 40px;">
&#x9;&#x9;&#x9;&#x9;&#x9;&#x9;<a href="#"><img class="rounded-circle img-thumbnail" src="demos/spa/images/services/3.jpg" alt="Why choose Us?"></a>
&#x9;&#x9;&#x9;&#x9;&#x9;</div>
&#x9;&#x9;&#x9;&#x9;&#x9;<div class="fbox-desc">
&#x9;&#x9;&#x9;&#x9;&#x9;&#x9;<h3>Relax.<span class="subtitle cookie-font">We have got you Covered.</span></h3>
&#x9;&#x9;&#x9;&#x9;&#x9;&#x9;<p>Quos, non, esse eligendi ab accusantium voluptatem. Maxime eligendi beatae, atque tempora ullam. Vitae delectus quia, consequuntur rerum quo.</p>
&#x9;&#x9;&#x9;&#x9;&#x9;</div>
&#x9;&#x9;&#x9;&#x9;&#x9;<a href="#" class="button button-rounded" style="margin: 20px 0 0 0;">Read More</a>
&#x9;&#x9;&#x9;&#x9;</div>
&#x9;&#x9;&#x9;</div>

&#x9;&#x9;</div>
&#x9;</div>
&#x9;<div class="video-wrap d-block d-lg-none d-xl-none">
&#x9;&#x9;<div class="video-overlay" style="background: rgba(255,255,255,0.9);"></div>
&#x9;</div>
</div>

We will fix this code in the update. Thanks for your Patience.

Meanwhile, do let us know if we can help you with anything else or if you find any further issues with Canvas.

S
stookyFeb 24, 2020

cheers, thats how I did it
all fine

btw andy date scheduled for canvas 6?

S
SemiColonWebSTAFFFeb 25, 2020

Hello,

We are pushing to release it by 1st week of March! Fingers Crossed! :)

Do let us know if we can help you with anything else or if you find any further issues with Canvas.

Have the same question, or something new?

Sign in to the Canvas dashboard to reply or open your own topic. Canvas owners get direct help from the SemiColonWeb team.

Reply on the dashboard