Next.js Discord

Discord Forum

having issue with the height tailwind

Unanswered
Basset Bleu de Gascogne posted this in #help-forum
Open in Discord
Basset Bleu de GascogneOP
The background color is not reaching end of hte screen if i do h-screen and click on inspect then again the background color pauses till some point what should I use

13 Replies

Chinese Egret
What does the tailwind look like?
Basset Bleu de GascogneOP
sure sharing
this is the class for ther background block <div className="flex flex-col md:pl-[200px] md:pr-[150px] md:pt-10 bg-figma-500 md:h-screen items-center justify-center">
@Chinese Egret What does the tailwind look like?
Basset Bleu de GascogneOP
if i add hte above code thi is how it works which is fine
but on inspecting the page this happens
set min-h-screen
Basset Bleu de GascogneOP
@Samyar set min-h-screen
Basset Bleu de GascogneOP
thanks man alot
@Samyar set min-h-screen
Basset Bleu de GascogneOP
can you also help me out with something else
what
Basset Bleu de GascogneOP
I have applied the class items-center and justify center text center on the div so you can see the image the problem is the cosmos network is also centering
<div className=" rounded">
<div className="flex flex-col md:pl-[200px] md:pr-[150px] md:pt-10 bg-figma-500 min-h-screen items-center justify-center">
<h1 className="text-5xl font-bold text-white sm:pt-4">Intro to Cosmos
</h1>
<p className="pt-5 text-white text-xl">Prior to delving into the intricacies of Wormhole’s Gateway, it is essenƟal to
establish a solid foundaÆŸon by comprehending the key components of the
Cosmos ecosystem and gaining a fundamental understanding of the Cosmos
Network. This secƟon serves as a prerequisite for exploring Wormhole’s Gateway
and the possible role of Cosmos and its ecosystem in it.
</p>
<p className="pt-5 text-white text-xl">By the end of this secƟon, you should have a much beƩer idea of some key
components of Cosmos, which are building blocks of Gateway and its operaÆŸonal
mechanisms.
</p>
<p className="pt-5 text-white text-xl">Firstly, we will start by covering the basics that one need to grasp before diving
into Gateway. This means geƫng a good understanding on the fundamentals of
Cosmos and Wormhole. Once we have got that foundaÆŸon, we will then plunge
headfirst into Gateway, exploring its architecture, security aspects, some
potenÆŸal use-cases, and how one can kickstart their journey in building with
Gateway.
</p>

<h3 className="text-2xl font-bold text-white sm:pt-4 items-start justify-start text-left !important">Cosmos Network:</h3>


<button className="btn text-white w-[150px] items-center justify-center mt-2 text-center mb-4 tarnsition ease-in-out delay-150 hover:-translate-y-1 hover:scale-110 duration-300" >Continue</button>
</div>



</div>



</div>
I dont want it to center I want it to be on the left without removign it from parent div is it possible ?