CSS

Programovacie jazyky, rady, poradňa...
pao247
Expert
Expert
Príspevky: 190
Registrovaný: 29 jún 2008, 15:36

CSS

Príspevok od používateľa pao247 »

ahojte. Prosim vas ako urobim v CSS ked mam <a> tag display:block a aby som nemal ten block na full width ale len na dlzku textu v nom a nasledne aby som mal vsetky <a> zalomene pod sebou a nie v riadku. Dakujem
mjz
Medium Expert
Medium Expert
Používateľov profilový obrázok
Príspevky: 134
Registrovaný: 25 nov 2007, 14:20
Bydlisko: Bardejov

Re: CSS

Príspevok od používateľa mjz »

Takto?

Kód: Vybrať všetko

a {
    display: block;
    float: left;
    clear: both;
}
http://jsfiddle.net/cck4yc0g/1/

Ten display: block je tam zbytocny.
audiotrack
VIP
VIP
Používateľov profilový obrázok
Príspevky: 25958
Registrovaný: 09 sep 2005, 18:39
Kontaktovať používateľa:

Re: CSS

Príspevok od používateľa audiotrack »

float je lepšie nepoužívať kým netreba. Ak k tým linkom dá ešte text, tak už to bude mať rozhodené: http://jsfiddle.net/cck4yc0g/2/
radšej by som odporučil použiť niečo úplne iné, najprv sa zamyslieť prečo ten block požaduješ keď ho potom chceš manipulovať aby sa správal inak
pao247
Expert
Expert
Príspevky: 190
Registrovaný: 29 jún 2008, 15:36

Re: CSS

Príspevok od používateľa pao247 »

Kód: Vybrať všetko

http://pavolgaspar.sk/first/social_networks.html
nepozerajte web to su len zaciatky :)
potrebujem tie odkazy na FB Twitter atd .. urobit z nich btn aby boli pod sebou a aby bol kazdy tak siroky aky je dlhy nazov "Facebook, Twitter..."
mjz
Medium Expert
Medium Expert
Používateľov profilový obrázok
Príspevky: 134
Registrovaný: 25 nov 2007, 14:20
Bydlisko: Bardejov

Re: CSS

Príspevok od používateľa mjz »

No ja som myslel ze to musis spravit v CSSku a nemozes si dovolit zmenit HTML.

Zapis to takto:

Kód: Vybrať všetko

<ul>
    <li><a href="#">Facebook</a></li>
    <li><a href="#">Twitter</a></li>
    <li><a href="#">Youtube</a></li>
</ul>
LI sa sprava ako display: block ale A tag je uz klasicky inline takže to mas pod sebou a zaroven ich sirka sa rovna obsahu.

http://jsfiddle.net/cck4yc0g/3/

Ak by si ale chcel nastavit na A tag padding, margin alebo width a height tak mu musis nastavit display: inline-block
Michaelo
Hardcore addict
Hardcore addict
Používateľov profilový obrázok
Príspevky: 6177
Registrovaný: 16 júl 2008, 20:29
Bydlisko: Pri PC
Kontaktovať používateľa:

Re: CSS

Príspevok od používateľa Michaelo »

https://jsfiddle.net/2d37voyb/

No pre to co robis ty bud UL a LI, alebo pouzit stary dobry <br> tag.
Stoporko
VIP
VIP
Používateľov profilový obrázok
Príspevky: 3989
Registrovaný: 28 dec 2005, 14:24
Bydlisko: Holy Land
Kontaktovať používateľa:

Re: CSS

Príspevok od používateľa Stoporko »

Sorry za hijack témy, no tiež to súvisí s .css

Momentálne mám v .css toto:

Kód: Vybrať všetko

fieldset {
  background: #ffffff;
  border: 1px solid #cccccc;
  margin-top: 10px;
  margin-bottom: 32px;
  padding: 0 0 10px;
  position: relative;
  top: 12px;
  -khtml-border-radius: 4px;
  -moz-border-radius: 4px;
  -webkit-border-radius: 4px;
  border-radius: 4px;
  width: 170px;
}
Ako obísť problémy firefoxu s umiestnením "position: relative;" ?
V nadväznosti na to:
Potrebujem dosiahnuť, aby pre firefox platilo iné "top: xxx px;"

Vygúglil som napr.

Kód: Vybrať všetko

@-moz-document url-prefix() { 
  .selector {
     color:lime;
  }
}
no keď to dám do .css súboru, miesto ".selector" dám príslušné ".fieldset", tak to firefox veselo ignoruje a nespraví to, čo po ňom chcem (v tomto testovaciom prípade text na limetkovo)

Dopátral som sa aj k pridaniu priamo medzi { }:

Kód: Vybrať všetko

[if moz] width: 600px;
no ani v tomto prípade ohnivá líška nereaguje (nespraví daný element 600px široký).

Čo spraviť? Kde je chyba? Veľká vďaka za pomoc!

//autoeditácia príspevku (03 Okt 2015, 17:21)
Edit: vyriešené :D

Kód: Vybrať všetko

@-moz-document url-prefix() {
    fieldset {
        top: 300px;
    }
}
táto syntax funguje na selektívne css pre FF 38.05 :smt059
Napísať odpoveď