Fórum Root.cz

Hlavní témata => Vývoj => Téma založeno: MAS 28. 12. 2017, 17:21:18

Název: Oprava css layoutu
Přispěvatel: MAS 28. 12. 2017, 17:21:18

Ahoj, umí někdo odsadit ten prostřední box (žlutý) zleva a zprava od 10px? Mě to nejde :( Zkoušel jsem margin: 0 10px; ale ani se to nehne. Děkuji
https://www.w3schools.com/howto/tryit.asp?filename=tryhow_css_equal_height_media (https://www.w3schools.com/howto/tryit.asp?filename=tryhow_css_equal_height_media)

Název: Re:Oprava css layoutu
Přispěvatel: borekz 28. 12. 2017, 17:42:14

Stačí zrušit display:table-cell. Není to fake, že ?

Název: Re:Oprava css layoutu
Přispěvatel: MAS 28. 12. 2017, 17:45:50

Díky, ale snad poradí, kdo tomu rozumí..

Název: Re:Oprava css layoutu
Přispěvatel: jiřin 28. 12. 2017, 18:30:16

Snažíte se použít něco tak jak to použít nelze. Vždyť je to zobrazeno jako tabulka. Použijte to jako kontejner a strčte si dovnitř co potřebujete. Ještě jste toho přečetl málo, čtěte víc

Název: Re:Oprava css layoutu
Přispěvatel: Filip Jirsák 28. 12. 2017, 19:04:28

Rada nepoužívat na to tabulku byla správná. Na tohle se ideálně hodí flexbox.

Kód: [Vybrat]

.col-container {
    display: flex;
    width: 100%;
}
.col {
    flex-grow: 1;
    margin: 0 10px;
    padding: 16px;
}

Název: Re:Oprava css layoutu
Přispěvatel: andy 28. 12. 2017, 19:53:20

Presne tak ako by si to urobil v tabulke. Cize napr borderom (pridas col1 na zlty div a .col1 {border-left: 10px solid white; border-right: 10px solid white;}).

Název: Re:Oprava css layoutu
Přispěvatel: shojian 28. 12. 2017, 22:16:34

1. https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_Grid_Layout

2. Prosím, nepoužívej W3Fools