Jump to content

SUBIECTE NOI
« 1 / 5 »
RSS
Share abonament Netflix

Cum pot sa fac rost de un negativ...

Lant Bicicleta

Un designer artist: Raymond Loewy
 ATS din contactor modular

Parere apartament ~150k

Limitare la 100mb/s

Altercație
 Cartonașe și stickere t...

Ciobanesc german - zgarda electro...

Ce este instalatia asta? (Valea B...

BD-R Verbatim 25gb salvare Fisier
 Lupte WW2

Achizitie SUV, buget 17k euro

Gps traker pentru animale

Aplicatii terte pentru IPTV, OTT,...
 

Problemă site în div-uri

- - - - -
  • Please log in to reply
9 replies to this topic

#1
LucianMihai13

LucianMihai13

    Junior Member

  • Grup: Members
  • Posts: 43
  • Înscris: 09.06.2014
Problema vine în felul următor, am de făcut un site pentru un proiect la școală. Site-ul vreau clar să fie în div-uri. Desing-ul vreau să fie ca cel de mai jos.
Acum ideea este că nu pot, adică nu știu să fac acele trei div-uri paralele, ar fi un div cu pozele din stanga, unul care ar fi meniu, in centru, si altul cu poze in dreapta, cel de sus ar fi pe post de banner. La cele doua div-uri cu poze ar fi de folos daca as putea face si un scrolling.
           Deci... aveți idee ce pot face?
[ https://i.imgur.com/3ES9yrm.png?1 - Pentru incarcare in pagina (embed) Click aici ]

#2
genericuser01

genericuser01

    Member

  • Grup: Members
  • Posts: 290
  • Înscris: 01.09.2013
<div class="main-container">
<div class="header"></div>

<div class="content">
<div class="column-pictures"></div>
<div class="main-column"></div>
<div class="column-pictures"></div>
</div>

</div>


Unde clasele CSS column-pictures si main-column pot fi cu float: left;

Altfel:

<div class="main-container">
<div class="header"></div>

<div class="content">
<table cellspacing="0" cellpadding="0" border="0">
<tr>
<td class="pictures-column"></td>
<td class="main-column"></td>
<td class="pictures-column"></td>
</tr>
</table>
</div>

</div>


Daca vrei ca cele doua div-uri/td-uri sa fie cu scroll, poti sa te uiti peste proprietatea overflow: scroll; a CSS-ului.

Edited by genericuser01, 09 June 2014 - 12:35.


#3
dan-s

dan-s

    Active Member

  • Grup: Banned
  • Posts: 1,699
  • Înscris: 02.07.2013
Și nu uita ca după ce ai făcut un rând de astfel de div-uri să pui și un clearfix că te poți trezi apoi cu tot felul de monștrii în site.

#4
Nemesis-

Nemesis-

    Zeitsă

  • Grup: Senior Members
  • Posts: 7,253
  • Înscris: 23.05.2011
Trebuie sa se adapteze la dimensiunile ferestrei si pe verticala? Daca da, nu poti decat cu display:flex

#5
LucianMihai13

LucianMihai13

    Junior Member

  • Grup: Members
  • Posts: 43
  • Înscris: 09.06.2014

View Postgenericuser01, on 09 iunie 2014 - 12:30, said:

<div class="main-container">
<div class="header"></div>

<div class="content">
<div class="column-pictures"></div>
<div class="main-column"></div>
<div class="column-pictures"></div>
</div>

</div>


Unde clasele CSS column-pictures si main-column pot fi cu float: left;

Altfel:

<div class="main-container">
<div class="header"></div>

<div class="content">
<table cellspacing="0" cellpadding="0" border="0">
<tr>
<td class="pictures-column"></td>
<td class="main-column"></td>
<td class="pictures-column"></td>
</tr>
</table>
</div>

</div>


Daca vrei ca cele doua div-uri/td-uri sa fie cu scroll, poti sa te uiti peste proprietatea overflow: scroll; a CSS-ului.


Să știi că cu table chiar a mers, dar nu îmi merge primul exemplu.

#6
genericuser01

genericuser01

    Member

  • Grup: Members
  • Posts: 290
  • Înscris: 01.09.2013
Primul exemplu cere mai multa jonglerie cu CSS. Idea peste tot in lume e sa folosesti ceea ce functioneaza pentru scopul tau.

Daca vrei sa inveti despre float: left si clear: both, poti sa butonezi netul in timpul liber. Ambele variante sunt la fel de bune. Acum, daca are cineva mai mult de adaugat...

#7
LucianMihai13

LucianMihai13

    Junior Member

  • Grup: Members
  • Posts: 43
  • Înscris: 09.06.2014

View Postgenericuser01, on 09 iunie 2014 - 12:59, said:

Primul exemplu cere mai multa jonglerie cu CSS. Idea peste tot in lume e sa folosesti ceea ce functioneaza pentru scopul tau.

Daca vrei sa inveti despre float: left si clear: both, poti sa butonezi netul in timpul liber. Ambele variante sunt la fel de bune. Acum, daca are cineva mai mult de adaugat...
Bine. Mulțumesc de răspuns, o să-l termin în table și o să mai caunt informații și poate o să-l aduc la forma dorită și în div-uri.

O zi bună!

#8
Dumitru_Pavel

Dumitru_Pavel

    Member

  • Grup: Members
  • Posts: 453
  • Înscris: 06.02.2014
daca tot esti la inceput, incearca sa te obisnuiesti bine, adica layout-ul sa fie din div-uri

acolo la poze as pune div iar in acest div un tabel pt poze, le manipulezi mai usor in tabel

#9
dan-s

dan-s

    Active Member

  • Grup: Banned
  • Posts: 1,699
  • Înscris: 02.07.2013
Eu totuși aș recomanda pentru inițiator să folosească etichetele html așa cum trebuie. Table pentru tabele și nimic altceva iar layer-ele să fie definite cu div. Dacă folosim table pentru orice atunci ce ne facem cu HTML5 când vom avea n-șpe tipuri de etichete care fac cam același lucru: header, footer, section, aside, article, div, etc.?

#10
LucianMihai13

LucianMihai13

    Junior Member

  • Grup: Members
  • Posts: 43
  • Înscris: 09.06.2014
Am reusit pana la urma sa fac in div-uri ce ce am dorit si am invatat si mult mai mult css. Va multumesc tuturor pentru sfaturi si implicare, am mai fost si pe alte site-uri de tip forum dar nu mi s-a răspuns niciodată așa repede la o problemă, vă mulțumesc.

Anunturi

Second Opinion Second Opinion

Folosind serviciul second opinion ne puteți trimite RMN-uri, CT -uri, angiografii, fișiere .pdf, documente medicale.

Astfel vă vom putea da o opinie neurochirurgicală, fără ca aceasta să poată înlocui un consult de specialitate. Răspunsurile vor fi date prin e-mail în cel mai scurt timp posibil (de obicei în mai putin de 24 de ore, dar nu mai mult de 48 de ore). Second opinion – Neurohope este un serviciu gratuit.

www.neurohope.ro

0 user(s) are reading this topic

0 members, 0 guests, 0 anonymous users

Forumul Softpedia foloseste "cookies" pentru a imbunatati experienta utilizatorilor Accept
Pentru detalii si optiuni legate de cookies si datele personale, consultati Politica de utilizare cookies si Politica de confidentialitate