- Olyat tett a Netflix, amire senki sem számított
- Linux - haladóknak
- Asustor NAS
- Olcsóbb lett a Tesla Full Self-Driving szoftvere
- Crypto Trade
- Windows 10
- Az MSI RadiX AXE6600 tesztje – router, játékosoknak
- Vodafone otthoni szolgáltatások (TV, internet, telefon)
- A TikTokon marakodik Trump és Biden
- Milyen routert?
Új hozzászólás Aktív témák
-
DeltaPower
őstag
válasz Forza_JUVE #850 üzenetére
position: fixed; bottom: 10px;
"Moonshine Whiskey (70°, ízesítés nélküli) van. Fincsi" - Teebee - "De az kiírtaná az egész családomat..Akkor is ha csak én innék belőle.." - forintuser
-
Forza_JUVE
aktív tag
válasz DeltaPower #851 üzenetére
köszi
-
MasOyama
őstag
Tud nekem abban valaki segíteni, hogy hogyan tudok egy háttérképet középre rendezni, de akkor is középre kellene rendezni, ha a felbontás kisebb, mint a háttérkép.
Mondjuk van egy 1920 széles háttérképem, és valaki 1024 ben nézi az oldalt, akkor a háttérképet ne 0 pixeltől mutassa 1024-ig, hanem kb. 448 adik pixeltől...1472 ig.
Layernél, táblázatnál csak középre helyezést találtam, nem tudom a háttérképet akár negatívba eltolni automatikusan.
PCMENTOR - Számítógép és Laptop Szerviz
-
SektorFlop
aktív tag
Sziasztok! IE problémáim vannak, van egy main id-vel ellátott div-em. Középre szeretném helyezni, margin: auto-val tökéletesen középre kerül minden böngészőbe, de IE-n nem igazán akar összejönni... valaki tudna segíteni?
"Amikor már azt hittem kint vagyok, ezek mindig visszarántottak..."
-
v2izzy
tag
Hello! Egy elég fura, nem is hibát, inkább viselkedést tapasztaltam az :nth-child() selector-nál.Itt a példa. Ha a két :nth-child()-os sort kikommentezem akkor megy szépen az .addClass(), .removeClass(). Viszont :nth-child()-al úgy tűnik nem. Úgy gondolom (inspector ezt mutatta), hogy az :nth-child()-os css rule erősebb, mint az .active class (ha az element-nek direktben, style-ba adom meg, akkor megy). Tehát így végül is érthető lenne, hogy miért nem működik, de számomra ez így kicsit logikátlan, pontosan ilyen miatt, mint a példa.
Lehet erre valami megoldást találni?
A választ előre köszönöm!http://flic.kr/ps/MuuJU | @gerhard_berger | https://github.com/gerhardberger
-
v2izzy
tag
válasz DeltaPower #857 üzenetére
Az !important-ra nem is gondoltam. Köszi, legalább így működik!
Viszont ez azért így akkor is fura, mert akkor most ha több dolgot is változtatok az :nth-child()-ban és azokat a másik class-ban is, akkor mind után oda kell tenni az !important-ot, ami még kevésbé elegáns, mint ha csak egy elé.[ Szerkesztve ]
http://flic.kr/ps/MuuJU | @gerhard_berger | https://github.com/gerhardberger
-
Speeedfire
nagyúr
Adott egy footer rész, ami jó lenne ha mindig a lap alján lenne ha teljesen legörgetem az egeret. Elég hülyén néz ki, ha az oldal közepén van. Most a tartalmi résznek adtam egy min-height 550px; értéket. Így most fullhd-nál jól néz ki, de gondolom pl 1200px magas monitornál megint nem lenne jó.
Próbáltam a position: fixed értéket is. De az sem a legjobb, mert mindig megjelenik ha kell ha nem. Van erre valami jó megoldás?[ Szerkesztve ]
Fotóim https://fb.com/toth.szabolcs.art || IG: http://instagram.com/_tothszabolcs_ || Weblapom http://szabolcs-toth.com
-
SektorFlop
aktív tag
válasz Speeedfire #859 üzenetére
Én pont most szórakoztam ezzel, ennyit adtam meg neki:
#footer {
clear:both;
width: 1000px;
height: 20px;
}a többinek pedig: float: left;, position nem kell nekik. nálam egyenlőre minden felbontáson jó.
viszont ebbe segítsetek nekem, google chrome-on dolgozom, a többi böngészőn nem jeleniti meg a css belállításaim bizonyos részét, vagyis a menu css-ét. van még egy ilyen oldalam ahol használom ezeket a menü beállításokat, és ráadásul a mostanihoz csak másoltam a css-t még nem is szerkeztettem egyenlőre de úgy se. valami elkerülhette a figyelmem?
[ Szerkesztve ]
"Amikor már azt hittem kint vagyok, ezek mindig visszarántottak..."
-
Sapphi
aktív tag
Sziasztok!
Olyan kérdésem lenne, hogy adott 3 div. És azt szeretném megoldani, hogy mind a 3-nak ugyan olyan magassága legyen.
Ugye ezt meg lehet oldani, úgy hogy megadom a magasságot fixen nekik, de én nem így szeretném, hanem hogy amelyik div a legmagasabb azt örökölje meg a többi div elem is (mármint a magasságát).
Nem tudom mennyire érthető a kérdésem. De remélem van rá megoldás.
Előre is köszönöm a segítségeket!
-
SecMan
csendes tag
Nem vagyok CSS guru, de ezt a példát nézd meg, hátha segít:
-
SektorFlop
aktív tag
nekem is pont ez kellene, 3 div van egymás mellet egy diven belül, és a középsőnek keret van megadva, azért az lenne szép ha mindig teljes magasságig kinyúlna a középső div, a css-es szinte megegyezett a tiéddel kiegészítettem egy-két hiányzó dologgal, de nekem nem akar összejönni.
"Amikor már azt hittem kint vagyok, ezek mindig visszarántottak..."
-
Siriusb
veterán
válasz SektorFlop #869 üzenetére
Fel tudod rakni valahová (pl. jsfiddle) a html+css-t? Ránézünk, valaki csak megmondja a tutit.
-
Siriusb
veterán
válasz SektorFlop #871 üzenetére
Nos, kicsit átszabtam a példádat. Nem tudom, melyik oszlophoz kellene igazodni a magasságnak, most a bal oldalihoz van igazítva, de ezt meg lehet csinálni a content-re is.
-
Siriusb
veterán
válasz SektorFlop #873 üzenetére
Szerintem akkor a div id=kozep-nek tegyél be egy képet háttérnek, pl. 1px vastag csík, oszt' jódidő.
-
trisztan94
őstag
Sziasztok!
Általában a CSS a legkisebb gondom, de a sok szerveroldal után pár dolgot elfelejtettemJelenleg így néz ki a "weboldal". Azt a fekete négyzetet szeretném jobb oldalra rakni, mint egy reklámsáv. Az ajax div, az az ahol a "Lorem ipsum" szöveg van. A négyzet egy <aside> tag-ban van. Így néz ki a kódom jelenleg:
#ajax
{
padding:10px;
width:550px;
}
aside{
padding:10px;
width:250px;
text-align:center;
background-color:black;
}
Itt Vannak a Main wrapper és a body stílusai is, nem tudom mennyire kell:
body
{
padding:0;
margin:0;
font-family: calibri;
}
#main_wrapper
{
margin:0 auto;
width:800px;
background-color: aliceblue;
postition:relative;
padding:10px 15px 5px 15px;
}És a kép, hogy most hogy néz ki:
Köszi!
[ Szerkesztve ]
https://heureka-kreativ.hu
-
SektorFlop
aktív tag
Ha valakinek van türelme és rátudna nézni megköszönném, problémám az elsősorban, hogy IE-ben nem tartja be a %-os méretezéseket. A másik pedig, hogy chrome-ban, megjelenik egy fehér rész a lap alján... és sehogy se jövök rá hogy az miért kerül oda.
"Amikor már azt hittem kint vagyok, ezek mindig visszarántottak..."
-
spammer
veterán
Nem igazán probléma, inkább kérdés, hátha másnak van tippje:
CSS animációk elvileg támogatva vannak IE 10-től, gyakorlatilag mégsem megy egy darab sem IE 10 (10.0.8250.0) alatt, még a microsoftos tesztoldal sem [link] Gugliztam, de mindenhol azt írták, hogy IE 10 alatt már támogatott. De akkor miért nem nyikkan meg?
Amúgy hihetetlen mekkora f0stalicska még ez a 10-es IE is, fényévekkel van a többi böngészőtől..
„A feketébe öltözött ember a sivatagon át menekült, a harcos pedig követte."
-
-
szmegma
aktív tag
Lenne egy vizszintesen pozicionalando problemam:
Ha az asztal felbontasat valtoztatom, akkor a kepen lathato 4 kis lilas teglalap (kurzoros) vizszintesen elmaszik jobbra vagy balra abbol a kek keretes reszbol. A fuggoleges pozicionalast sikerult fixalnom.
Mit kellene hova irnom a css-ben, hogy megoldodjon ez a problemam?Igy kellene kineznie:
Koszonom.
CSS:
html, body, div#wrap1, div#wrap2, div#wrap3 {
height:100%;
width:100%;
}
body {
background:#222222;
overflow:auto;
background-image:url('2.gif');
}
div#wrap2 {
background: url('1.gif') repeat-x 0 300px;
}
div#wrap1 {
background: url('3.gif') repeat-x left top;
}
h1 {
font-size:200px;
font-family:'Zekton.Free';
color:#222222;
z-index:2;
}
div#stuff1 {
width:1000px;
height:192px;
overflow:hidden;
margin:0 auto 0 auto;
text-align:center;
position: relative;
top:130px;
}
div#stuff2 {
width:1000px;
height:250px;
overflow:hidden;
margin:0 auto 0 auto;
text-align:center;
position: relative;
top:140px;
}
div#stuff1 div {
height:190px;
position:relative;
overflow:hidden;
z-index:2;
}
div#stuff1 h1 {
margin:15px 0 0 0;
}
div#stuff2 div {
height:70px;
position:relative;
overflow:hidden;
z-index:2;
}
div#stuff2 h1 {
margin:-180px 0 0 0;
}
* {
margin:0;
padding:0;
}
a.ss {
z-index:9999;
background-image:url('5.png');
width:21px;
height:30px;
position:absolute;
top:1px;
}
div#image2 {
position:absolute;
right:0;
bottom:0;
background-image: url('4.gif');
width:98px;
height:98px;
visibility:hidden;
z-index:50;
}HTML:
<div style="background-position: 0pt 180.011px;" id="wrap1">
<div style="background-position: 0pt 440.005px;" id="wrap2">
<div id="wrap3">
<div id="stuff1">
<div style="z-index: 43;"><h1>szoveg</h1></div>
<div style="top: -190px; left: -1px;"><h1 style="color:#20E1F8;">szoveg</h1></div>
<div style="top: -380px; left: 1px;"><h1 style="color:#20E1F8;">szoveg</h1></div>
<div style="top: -571px;"><h1 style="color:#20E1F8;">szoveg</h1></div>
<div style="top: -759px;"><h1 style="color:#20E1F8;">szoveg</h1></div>
</div>
<div style="visibility: visible; opacity: 0.39; bottom: 159.995px; right: 145px;" id="image2"></div>
<div id="stuff2">
<div style="margin: 1px 0pt 0pt; z-index: 43; color:#FF0000;"><h1>szoveg</h1></div>
<div style="top: -70px; left: -1px;"><h1 style="color:#20E1F8;" id="z">szoveg</h1></div>
<div style="top: -140px; left: 1px;"><h1 style="color:#20E1F8;">szoveg</h1></div>
<div style="top: -211px;"><h1 style="color:#20E1F8;">szoveg</h1></div>
<div style="top: -279px;"><h1 style="color:#20E1F8;">szoveg</h1></div>
<a style="background-position: 0pt 9.9947px; opacity: 1; left:435px;" href="1" id="link1" class="ss"></a>
<a style="background-position: 0pt 27.9947px; opacity: 1; left:519px;" href="2" id="link2" class="ss"></a>
<a style="background-position: 0pt 48.9947px; opacity: 1; left:876px;" href="3" id="link3" class="ss"></a>
<a style="background-position: 0pt 66.9947px; opacity: 1; left:936px;" href="4" id="link4" class="ss"></a>
</div>
</div>
</div>
</div>[ Szerkesztve ]
TV: JZ1000
-
Dreamweaver7
csendes tag
Szerintem inkább a kék keret van elcsúszva, ez relatív, de valami biztos nincs a helyén.
Az sorközi CSS felülír mindent, vigyázz vele. A HTML kódból szedd ki az összes CSS-t, helyette class és/vagy id jelölőket használj, sokkal tisztább lesz a kódod és nem jönnek majd elő nehezen levadászható hibák. Utána próbáld ki, lehet egyből megtalálod a problémát.
Egyébként h1 elemből egy oldalon csak egy darabot illik használni.
-
szmegma
aktív tag
válasz Dreamweaver7 #881 üzenetére
Szia,
A HTML-bol ki fogom szedni ahogy tanacsoltad, de mit ertesz sorközi CSS felülír mindent alatt?
A HTML-ben levo CSS-re gondolsz?
Koszonom.TV: JZ1000
-
Dreamweaver7
csendes tag
Igen, a HTML-ben lévőre, ott is az inline CSS-re, ez a sorközi, bár inline-nak nevezni jobb. A W3Schools stíluslapokkal foglalkozó oldalán sok információt megtalálsz a CSS kiértékelési sorrendjével kapcsolatban is, ajánlom elolvasni.
Egyébként lehet a HTML-ben CSS nyugodtan, csak vigyázni kell vele. Kis weblapoknál nem probléma, mert fejben tartható, mit hova tett az ember, de már egy pár oldalból álló lap esetén is érdemes inkább külső fájlba tenni. Sokkal átláthatóbb lesz és sokkal könnyebben megtalálja az ember az esetleges hibákat.
Én is jártam már úgy, hogy lusta voltam a külső CSS-be új osztályt, azonosítót adni egy-egy elemnek, hanem csak beírtam a HTML elemebe a style="" meghatározást, azután később sokáig keresgéltem, hogy ez miért is így néz ki vajon, ahogy nem kellene.
Szóval a lényeg az, hogy a programkód legyen átlátható és követhető, az elnevezések pedig kifejezőek, ezzel a későbbiekben sok munkát megspórol az ember. A W3Schools oldalt mindenképp ajánlom HTML információforrásként. Ha esetleg hozzájutsz, olvasd el a Virginia DeBolt - HTML és CSS - Webszerkesztés stílusosan című könyvet, én se vagyok még nagyon profi web fejlesztésben, de számomra is érthető volt.
Sok sikert!
Ja és Boldog Karácsonyt!
-
Forza_JUVE
aktív tag
Sziasztok!
B.U.É.K. mindenkinek!
Kérnék egy kis segítséget CSS-ben: adva van egy html oldal, aminek van külön <div> tag-ként egy fejléce, lábléce, törzse és jobb oldala.
Az aljával és tetejével nincs is gond, de hogyan adjam meg a középső és jobb oldali <div> magasságát úgy, hogy tartalomtól függetlenül legyen 100%, vagyis pont akkora, mint a mellette levő.
Azaz ha a középső részben van mondjuk 5 bekezdés, míg a jobb oldalon semmi, a jobb oldal akkor is legyen pont akkora magas, mint a középső rész ... és fordítva szintén.Eddig a css-ben csak a float: left; ... illetve a másiknál a float: right; szerepel. A height-nek hiába adok általános adatokat, mint pl. height: 100%, vagy inherit ... nem működik.
Gondolom van erre egy tök egyszerű megoldás, én viszont még nem vagyok elég jártas ebben a html programozásban, az istennek nem tudok rájönni!
Köszi előre is.
-
martonx
veterán
-
martonx
veterán
Sőt itt van egy rakás megoldási lehetőség. Mondjuk ilyen triviális, mégis ősi problémáknál látszódik, hogy a CSS elég ratyi technológia még mindig. Dehát mit tegyünk, ha nem találtak még fel ennél jobbat.
Én kérek elnézést!
-
Dreamweaver7
csendes tag
válasz Forza_JUVE #884 üzenetére
Szia!
Nekem is van még mit tanulnom HTML/CSS terén és a kérdésedre nem tudom igazán a választ. Ha ilyesmi két oszlopos elrendezést szeretnél, amilyet írtál, gondolkodj el az alábbi megoldáson, lehet megfelel neked is.
A HTML:
<!DOCTYPE HTML>
<html>
<head>
<meta http-equiv="content-type" content="text/html; charset=utf-8">
<meta name="author" content="Dreamweaver7">
<meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=yes"/>
<title>Teszt HTML oldal</title>
<link href="test.css" rel="stylesheet" type="text/css" />
</head>
<body>
<div id="page_container">
<div id="header">
<p>Fejléc</p>
</div>
<div id="middle_section">
<div id="content_right">
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Morbi viverra mi ac massa euismod in imperdiet metus tempor. Phasellus vestibulum varius dolor vel molestie. Duis rutrum metus non purus varius eget porttitor leo ultricies. In sed odio sed nibh interdum ultricies in id dolor. Donec euismod augue vel lacus luctus blandit.</p>
</div>
<div id="content_left">
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Morbi viverra mi ac massa euismod in imperdiet metus tempor. Phasellus vestibulum varius dolor vel molestie. Duis rutrum metus non purus varius eget porttitor leo ultricies. In sed odio sed nibh interdum ultricies in id dolor. Donec euismod augue vel lacus luctus blandit. Donec vel felis felis, sed vestibulum nibh. Maecenas mattis tortor in sapien tempus ut sagittis est tincidunt. Duis sed dolor leo, eu dictum tortor.</p>
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Morbi viverra mi ac massa euismod in imperdiet metus tempor. Phasellus vestibulum varius dolor vel molestie. Duis rutrum metus non purus varius eget porttitor leo ultricies. In sed odio sed nibh interdum ultricies in id dolor. Donec euismod augue vel lacus luctus blandit. Donec vel felis felis, sed vestibulum nibh. Maecenas mattis tortor in sapien tempus ut sagittis est tincidunt. Duis sed dolor leo, eu dictum tortor.</p>
</div>
<div class="clearer">
</div>
</div>
<div id="footer">
<p>Lábléc</p>
</div>
</div>
</body>
</html>A CSS:
body,div,html,p
{
border: none;
padding:0;
margin:0;
}
.clearer
{
clear:both;
}
#page_container
{
}
#header
{
background-color:#333333;
color:#ffffff;
font-size:40px;
height:100px;
text-align:center;
width:auto;
}
#middle_section
{
background-color:#00ff00;
margin:0 0 0 0;
}
#footer
{
background-color:#666666;
color:#ffffff;
font-size:40px;
height:100px;
text-align:center;
width:auto;
}
#content_left
{
background-color:#009900;
float:none;
margin:0 200px 0 0;
}
#content_right
{
background-color:#00bb00;
float:right;
width:200px;
}Képernyőfotók keskeny és széles ablakkal, így ugyanúgy látszik a viselkedése, mintha valamelyik oszlopba több vagy éppen kevesebb szöveget tennénk:
Az oszlopok viselkedése széles ablaknál
Az oszlopok viselkedése keskeny ablaknál
Én ilyen megoldást tudok rá, de én is még tanulom a HTML/CSS-t.
[ Szerkesztve ]
-
Forza_JUVE
aktív tag
válasz Dreamweaver7 #887 üzenetére
Köszi mindenkinek a választ!
Úgy fest alakul a dolog, már látom azt a biz. fényt! Még simogatom itt-ott, de az alap már működik!KÖSZI MÉG 1X!!
Közben én is találtam egy hasznos oldalt, belinkelem, hátha vkinek jól jön majd ...
Ciao
-
Dreamweaver7
csendes tag
válasz Forza_JUVE #888 üzenetére
Szívesen, amit linkeltél, az sokkal profibb megoldás, mint az enyém, köszi, könyvjelzőztem.
-
Muton
addikt
Heló!
Van egy divem, abban 4 másik (label, checkbox, label2, input)
Az a feladat, hogy a label legyen a keretdivben bal oldalon, utána a checkbox, amelyek között mindig azonos a távolság (mert lokalizált a label, lehet, hosszabb, rövidebb a szöveg benne) ez megvan, marginnal csinálom.
Azt hogy lehet megadni a label2-nek, hogy mindig a keret bal oldalától pl 100 px-re legyen és ne érdekelje, hogy ebben a távolságban label és checkbox mit csinál, és mekkora?Muton#2316 - $z@r a drop >_<
-
Lacces
őstag
Hát ilyet, kifog rajtam a css... (fél évig szinte alig használtam, de ez égő...)
Help kellene.1. Probléma: #miniblocks-ra nem működik a fehér háttérszín, kipróbáltam a #content-re ott megy.
2. Probléma: .miniblock span - esetében nem működik a szöveg közepre igazítása, hanem balra igazítva áll.Néztem én a Chrome fejlesztő eszközzel is, de ott nem láttam, hogy az egyik css property kiiktatná a másikat.
A válaszokat előre köszönöm. Annak mégjobban örülnék, ha valaki el is magyarázná, hogy miért jött elő ez a probléma.body{
background-color : #3A6E1B
}
#logo{
text-align:center
}
#content{
}
#miniblocks{
background-color: white;
margin-left: auto ;
margin-right: auto ;
margin-top : 30px;
width : 800px;
}
.miniblock{
float:left;
font-family: 'Abel', sans-serif;
font-size: 16px;
margin-left: 5px ;
margin-right: 5px ;
width:30%;
}
.miniblock span{
font-weight:bold;
text-align:center;
}
.miniblock p{
text-align:left;
}
.miniblock a{
}
.clear{
clear : both;
}
</style>
</head>
<body >
<div id="wrapper">
<div id="content">
<div id="logo">
</div>
<div class="clear"></div>
<div id="miniblocks" >
<div class="miniblock">
<span>Teszt1</span>
<p>
A Lorem Ipsum egy egyszerû szövegrészlete, szövegutánzata a betûszedõ és nyomdaiparnak. A Lorem Ipsum az 1500-as évek óta standard szövegrészletként szolgált az iparban; mikor egy ismeretlen nyomdász összeállította a betûkészletét és egy példa-könyvet vagy szöveget nyomott papírra, ezt használta. ...<a href="#">részletek»»</a></p>
</div>
<div class="miniblock">
<span>Teszt2</span>
<p>
A Lorem Ipsum egy egyszerû szövegrészlete, szövegutánzata a betûszedõ és nyomdaiparnak. A Lorem Ipsum az 1500-as évek óta standard szövegrészletként szolgált az iparban; mikor egy ismeretlen nyomdász összeállította a betûkészletét és egy példa-könyvet vagy szöveget nyomott papírra, ezt használta. .. <a href="#">részletek»»</a></p>
</div>
<div class="miniblock">
<span>Teszt3</span>
<p>
A Lorem Ipsum egy egyszerû szövegrészlete, szövegutánzata a betûszedõ és nyomdaiparnak. A Lorem Ipsum az 1500-as évek óta standard szövegrészletként szolgált az iparban; mikor egy ismeretlen nyomdász összeállította a betûkészletét és egy példa-könyvet vagy szöveget nyomott papírra, ezt használta. ...<a href="#">részletek»»</a></p>
</div>
</div>
<div class="clear"></div>
</div><!-- end of content -->
</div><!-- end of wrapper --> -
Dreamweaver7
csendes tag
A "miniblock" osztály float:left tulajdonsága miatt a "miniblocks" azonosítójú div magassága 0 px, azért nem látszik.
A "<div class="clear"></div>" részt tedd be a "miniblocks" azonosítójú div végére így:
<body >
<div id="wrapper">
<div id="content">
<div id="logo">
</div>
<div class="clear"></div>
<div id="miniblocks" >
<div class="miniblock">
<span>Teszt1</span>
<p>
A Lorem Ipsum egy egyszerû szövegrészlete, szövegutánzata a betûszedõ és nyomdaiparnak. A Lorem Ipsum az 1500-as évek óta standard szövegrészletként szolgált az iparban; mikor egy ismeretlen nyomdász összeállította a betûkészletét és egy példa-könyvet vagy szöveget nyomott papírra, ezt használta. ...<a href="#">részletek»»</a></p>
</div>
<div class="miniblock">
<span>Teszt2</span>
<p>
A Lorem Ipsum egy egyszerû szövegrészlete, szövegutánzata a betûszedõ és nyomdaiparnak. A Lorem Ipsum az 1500-as évek óta standard szövegrészletként szolgált az iparban; mikor egy ismeretlen nyomdász összeállította a betûkészletét és egy példa-könyvet vagy szöveget nyomott papírra, ezt használta. .. <a href="#">részletek»»</a></p>
</div>
<div class="miniblock">
<span>Teszt3</span>
<p>
A Lorem Ipsum egy egyszerû szövegrészlete, szövegutánzata a betûszedõ és nyomdaiparnak. A Lorem Ipsum az 1500-as évek óta standard szövegrészletként szolgált az iparban; mikor egy ismeretlen nyomdász összeállította a betûkészletét és egy példa-könyvet vagy szöveget nyomott papírra, ezt használta. ...<a href="#">részletek»»</a></p>
</div>
<div class="clear"></div>
</div>
</div><!-- end of content -->
</div><!-- end of wrapper -->
</body>Így már látszik a fehér háttér, kipróbáltam.
szerk: A span tulajdonságaihoz tedd hozzá a "display:block;" sort, így középre igazodik.
[ Szerkesztve ]
-
Lacces
őstag
válasz Dreamweaver7 #894 üzenetére
kösz, a float:left-re sosem jöttem volna rá hogy ő a bünős.
-
Lacces
őstag
Na még egy... középre rendezés nincsen... more-way osztályú div nem akarja középre venni az <a> tag-et. hanem balra igazítva van...
CSS:
.intro{
float:left;
margin-left:6px;
margin-right:6px;
width:31%;
}
.intro img{
padding-left:12px;
}
.more-way{
margin: 0px auto;
text-align:center;
}HTML
<div class="intro">
<h2>Teszt</h2>
<img src="design/line.png" alt="aszfalt" />
<p>Maecenas pede nisl, elementum eu, ornare ac, malesuada at, erat. Proin gravida orci porttitor enim accumsan lacinia. Donec condimentum, urna non molestie semper, ligula enim ornare nibh, quis laoreet eros quam eget ante. Aliquam libero. Vivamus nisl nibh, iaculis vitae, viverra sit amet, ullamcorper vitae, turpis. Aliquam erat volutpat. Vestibulum dui sem, pulvinar sed, imperdiet nec, iaculis nec, leo. </p>
<img src="design/line.png" alt="aszfalt" />
<div class="clear"></div>
<div class="more-way">
<a href="/szolgaltatasok.html">RÉSZLETEK</a>
</div>
</div>[ Szerkesztve ]
-
Louro
őstag
Sziasztok
Két napi kutatás után fordulok hozzátok.
A téma: transparency.Adott egy div. Abban elhelyeztem 3 másik div-et.
A fő div-nek beállítottam, hogy az opacity:0.3. A benne levő 3 div-nek pedig 0.7-et. Az a baj, hogy IE9 és IE10 alatt jól jelenik meg, de szinte kutya se használja már. A gondom, hogy Chrome alatt meg csak a fő div értékét veszi figyelembe. A rajta levőket a fődiv-hez állítja. Azonban, ha a fő div a kevésbé áttetszőbb (az 0.9-es értékkel bír), akkor a rajta levő 3 div átlátszó lesz.
A kódrészletek:
css:
#base {
margin-top: 40px;
margin-left:auto;
margin-right:auto;
width:1000px;
height:520px;
opacity:0.3;
filter:alpha(opacity='30');
-webkit-opacity:0.3;
-khtml-opacity:0.3;
-moz-opacity:0.3;
-webkit-border-radius: 15px;
border-radius: 15px;
background:#eee;
z-index:0;
border:2px;
}#menu-base {
position: absolute;
margin-top:10px;
margin-left:10px;
width:150px;
height:500px;
filter:alpha(opacity='70');
-webkit-opacity:0.7;
-khtml-opacity:0.7;
-moz-opacity:0.7;
opacity:0.7;
-webkit-border-radius: 15px;
border-radius: 15px;
background:#bbb;
z-index:1;
}#content-base {
position: absolute;
margin-top:10px;
margin-left:165px;
width:700px;
height:500px;
filter:alpha(opacity='70');
-webkit-opacity:0.7;
-khtml-opacity:0.7;
-moz-opacity:0.7;
opacity:0.7;
-webkit-border-radius: 15px;
border-radius: 15px;
background:#bbb;
z-index:1;
}#design-base {
position: absolute;
margin-top:10px;
margin-left:870px;
width:115px;
height:500px;
filter:alpha(opacity='70');
-webkit-opacity:0.7;
-khtml-opacity:0.7;
-moz-opacity:0.7;
opacity:0.7;
-webkit-border-radius: 15px;
border-radius: 15px;
background:#bbb;
z-index:1;
}html:
<div id="base">
<div id="menu-base">
.....
</div>
<div id="content-base">
.......
</div>
<div id="design-base">
...
</div>
</div>Mess with the best / Die like the rest
Új hozzászólás Aktív témák
- Pécs és környéke adok-veszek-beszélgetek
- HiFi műszaki szemmel - sztereó hangrendszerek
- Olyat tett a Netflix, amire senki sem számított
- Audiofil mobillal készül a Moondrop
- Politika
- Mibe tegyem a megtakarításaimat?
- Assetto Corsa Competizione
- Spórolós topik
- Nők, nőügyek (18+)
- Linux - haladóknak
- További aktív témák...
- LG UltraGear 27GP850P-B Monitor
- Samsung Galaxy A52s 5G-Kártyafüggetlen-Hivatalos Samsug jótállási jegy-Garanciális-Karcmentes
- HIBÁTLAN iPhone 14 Pro 512GB Silver - Kártyfüggetlen, 1 ÉV GARANCIA, 100% Akkumulátor
- Pavilion 15-cx0023nf 15.6" FHD IPS i5-8300H GTX 1050 16GB 500GB NVMe gar
- HIBÁTLAN iPhone 14 Pro 1TB Space Black - Kártyfüggetlen, 1 ÉV GARANCIA, 100% Akkumulátor