Where communities thrive


  • Join over 1.5M+ people
  • Join over 100K+ communities
  • Free without limits
  • Create your own community
People
Activity
  • Aug 17 09:32
    User @bjorno43 unbanned @linkin-park
  • Jun 20 21:19
    @bjorno43 banned @shenerd140
  • Apr 25 17:13
    @mstellaluna banned @cmal
  • Jan 08 22:05
    @mstellaluna banned @dertiuss323
  • Nov 07 2018 04:42
    User @texas2010 unbanned @ows-ali
  • Nov 02 2018 16:25
    @texas2010 banned @ows-ali
  • Oct 12 2018 05:50
    @bjorno43 banned @NACH74
  • Oct 05 2018 23:02
    @mstellaluna banned @JomoPipi
  • Sep 16 2018 12:21
    @bjorno43 banned @yash-kedia
  • Sep 16 2018 12:16
    @bjorno43 banned @vnikifirov
  • Sep 05 2018 08:12
    User @bjorno43 unbanned @androuino
  • Sep 05 2018 07:38
    @bjorno43 banned @androuino
  • Aug 23 2018 16:57
    User @bjorno43 unbanned @rahuldkjain
  • Aug 23 2018 16:23
    @bjorno43 banned @rahuldkjain
  • Jul 29 2018 14:13
    User @bjorno43 unbanned @jkyereh
  • Jul 29 2018 01:00
    @bjorno43 banned @jkyereh
  • Jul 10 2018 22:09
    @bjorno43 banned @manafn
  • Jul 06 2018 15:20
    @texas2010 banned @imlegend19
  • Jul 03 2018 12:28
    @bjorno43 banned @vbvmatta
  • Jun 29 2018 13:54
    @bjorno43 banned @OGTechnoBoy
Javierguaregua
@Javierguaregua
grid-column-start: LINE;
grid-column-end: LINE;
asd
Chris Cullen
@123xylem
Could this make the last column taller than the actual grid?
Javierguaregua
@Javierguaregua
yup
I've tried it
Idk if there's another way to do it
Chris Cullen
@123xylem
If theres anyway ill take it!
Javierguaregua
@Javierguaregua

```<!DOCTYPE html>

<html>

<head>

<style>
.grid-container {
display: grid;
grid-template-columns: auto auto auto;
grid-gap: 10px;
background-color: #2196F3;
padding: 10px;
}
.grid-container > div {
background-color: rgba(255, 255, 255, 0.8);
text-align: center;
padding: 20px 0;
font-size: 30px;
}

.item3 {
grid-column-start: 3;
grid-column-end: 3;
grid-row-start: 1;
grid-row-end: 20;
}
</style>
</head>

<body>

<h1>Grid Lines</h1>

<div class="grid-container">
<div class="item1">1</div>
<div class="item2">2</div>
<div class="item3">3</div>
<div class="item4">4</div>
<div class="item5">5</div>
<div class="item6">6</div>
<div class="item7">7</div>

</div>

<p>You can refer to line numbers when placing grid items.</p>

</body>
</html>
```

Chris Cullen
@123xylem
Been at this for hours
Javierguaregua
@Javierguaregua
lol
I found it on w3
Chris Cullen
@123xylem
ok thanks looking at it now
@Javierguaregua thanks
@Javierguaregua but I need the last box to extend OUT of the grid
Javierguaregua
@Javierguaregua
Chris Cullen
@123xylem
because the grid has a background Image that needs to not be the bottom of the page
in your example the bg goes to the bottom
meaning for me the bg image would also go to the bottom
Javierguaregua
@Javierguaregua
hm sorry I don't understand ?, you can change the values in grid-row-end
Chris Cullen
@123xylem
so I could get the last big grid to stretch from inside the grid to outside
i want a box |XXX|
|XXX|
|__X|
X
where the last X has stretched out of the box to the bottom right
my diagram fkd up :/
Javierguaregua
@Javierguaregua
|XXX|
|XXX|
|__X|
X
like that?
Chris Cullen
@123xylem
Yea but with the X on the right - broken out of the box
xxx
xxx
x
xxx
xxx
--X
Moisés Man
@moigithub
i dont understand.. u want the last X takes all the bottom area ?
Chris Cullen
@123xylem
I want a grid ------------------------------------------- [ xxx ]
with the last col breaking through the bottom ---x
so that the grid background isnt holding the bottom of the last colum
https://ibb.co/iLffcp @moigithub As you can see the form colum needs to extend under the grid
but the background image of the grid must not be inline with the bottom of the form
Christos Kokolios
@KokoChris
Hey everyone. I am launching a blog focused on helping people who want to transition the web development field. I would appreciate some feedback here https://christos21.typeform.com/to/PR7CFk. Thanks!
Moisés Man
@moigithub

container <--- this have the background image
---- grid
--------grid elements * 6

the whole form is part of a grid element

Chris Cullen
@123xylem
@moigithub yes
I need the form to break out of the container
with css grid or flexbox or something
Ive been at this for hours!
Moisés Man
@moigithub
ur grid is used only for positioning
like this https://prnt.sc/kmthwx
purple = container
red = grid
green ur form
@123xylem
background image should NOT strech down, or need to be custom... with a white part on the bottom
Chris Cullen
@123xylem
@moigithub Yes.. but the container has the bg Image in it
im trying to replicate that photo
Javierguaregua
@Javierguaregua
background: no-repeat ; ?
maybe a max width ?
Moisés Man
@moigithub
ur background image should be something like this https://prnt.sc/kmtkuk @123xylem
Chris Cullen
@123xylem
yes
thats the image
@moigithub Im now trying to just put that background image in as an image... add the form in seperately with position absolite
Javierguaregua
@Javierguaregua
have you done it yet?