Curvy corners – CSS – Fórum – Programujte.com
 x   TIP: Přetáhni ikonu na hlavní panel pro připnutí webu
Reklama
Reklama

Curvy corners – CSS – Fórum – Programujte.comCurvy corners – CSS – Fórum – Programujte.com

 

Hledá se programátor! Plat 1 800 € + bonusy (firma Boxmol.com)
Figa0
Super člen
2. 12. 2007   #1
-
0
-

Ahoj, snažím se aplikovat zaoblené rohy pomocí této metody
http://www.curvycorners.net/usage.php Bohužel hned ze začátku jsem narazil na
pár problémů.Po aplikování jsou obrázky co mají nastavené position: absolute,
překrité samotnou stránkou.Druhý problém je ten, že když nastavím zaoblení
pouze
na jednu stranu borderu, tak se zobrazí jen oblouček a zbytek borderu
zmizí.Nevíte prosím někdo jak tyto problémy vyřešit?Předem děku ji za odpovědi.

Nahlásit jako SPAM
IP: 87.249.133.–
Reklama
Reklama
Onsi0
Stálý člen
2. 12. 2007   #2
-
0
-

To Figa : skus sem vlozit svoj zdrojovy kod...

Nahlásit jako SPAM
IP: 91.127.11.–
Figa0
Super člen
2. 12. 2007   #3
-
0
-

index



<?xml version="1.0" encoding="ISO-8859-2" ?>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml11/DTD/xhtml1-strict.dtd">

<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="cs">
<head>

<script type="text/javascript" src="rounded-corners.inc.js"></script>
<link rel="stylesheet" type="text/css" href="css.css" media="screen" />

<meta http-equiv="content-type" content="text/html; charset=ISO-8859-2" />
<meta name="generator" content="PSPad" />

<script type="text/JavaScript">

window.onload = function()
{
settings = {
tl: { radius: 10 },
tr: { radius: 10 },
bl: { radius: 10 },
br: { radius: 10 },
antiAlias: true,
autoPad: false
}

var divObj = document.getElementById("all");

var cornersObj = new curvyCorners(settings, divObj);
cornersObj.applyCornersToAll();
}

</script>

<title>OSDOS.net</title>

</head>
<body>
<img id="c" src="c.jpg" alt="C:">
<img id="disketa" src="disketa.jpg" alt="OSDOS">
<img id="pc" src="pc.jpg" alt="IBM PC">
<div id="all">
<div id="hlavni">



<div id="hlavicka">
<img src="hlavicka.jpg" alt="Home"/>
</div>

<div id="obsah">
<div id="menu2">
<div id="inmenu">
<div id="ininmenu">
</div>
<img src="dir.jpg" alt="UP-DIR"/>
</div>
</div>
<!--<div id="menu">
<br>
<ul>
<li><a href="recenze.html">Recenze</a></li>
<li><a href="howtodos.html">Jak na DOS</a></li>
<li><a href="download.html">Download</a></li>
<li><a href="kontakt.html">Kontakt</a></li>
<li><a href="forum.html">Forum</a></li>
<li><a href="odkazy.html">Odkazy</a></li>
</ul>
</div>-->



<div id="content">
<!--<div id="nadpis">Novinky</div>
<div id="novinky">
<div id="ndatum">
25.11.2007
</div>
<div id="ntext">
Spuštěn nový design, napište nám jak se vám líbí!!!
</div>
<div id="nautor">
Figa
</div>
<hr>
</div>

<div id="novinky">
<div id="ndatum">
1.1.2001
</div>
<div id="ntext">
Nechci zakládat nové téma a proto se zeptám zde.Můžu použít jasan hasan<br>
z tohoto tutorialu http://www.grafika.cz/art/vektory/p-dysk.html uz tam bude<br>
svůj web?Snažil jsem se kontaktovat autora, ale neodpovídá.Co meles?
</div>
<div id="nautor">
Dagon
</div>
<hr>
</div> -->
</div>
</div>

<div id="paticka">

<ul>
<li>Copyright © 2007 |</li>
<li>CSS lay-out by <a href="mailto:www.f@seznam.cz">Figa</a></li>
</ul>

</div>

</div>
</div>
</html>


CSS


/* resety */
* {
border: 0;
margin: 0;
padding: 0;
text-indent: 0;
}

h1, h2, h3 {
margin: 0;
padding: 0;
}

a img { border: 0; }

ul, ol { list-style: none; }

table, td, th { border: 0; font-size: 1em; font-weight: normal; }
/* end resety */


/* lay-out */
body {
background: white;
font: normal normal 0.7em tahoma, arial, verdana, sans-serif, helvetica;
letter-spacing: .1em;
line-height: 1.7;
margin: 0;
padding: 0;
text-align: center; /* vycentrovani hlavniho divu pro IE */
}

#all {
background: white;
border: 2px solid black;
height: auto;
margin: 50px auto 0 auto;
padding-bottom: 6px;
padding-top: 6px; /* odsazeni divu #hlavni zvrchu a zespodu - potřeba definovat prave zde */
text-align: left;
width: 700px;
}

#hlavni {
border: 1px solid black;
margin: 0 6px 0 6px;
width: auto;
height: auto;
_height: 680px;
}

#disketa {
position: absolute;
left: 115px;
top: 70px;
_left: 115px;
_top: 65px;
}

#hlavicka {
width: auto;
height: 140px;
background: white;
}

#obsah {
width: auto;
min-height: 490px;
margin: 5px 15px 0 0px;
padding-bottom: 5px;
}

#menu {
float: left;
width: 140px;
height: auto;
_height: 490px;
min-height: 490px;
margin-bottom: 5px; /* odsazeni od paticky pro IE */
font-size: 1.4em;
}

#c {
position: absolute;
left: 200px;
top: 282px;
}

#menu2 {
float: left;
width: 135px;
height: 300px;
border-top: 1px solid black;
border-right: 1px solid black;
border-bottom: 1px solid black;
padding-top: 6px;
padding-bottom: 6px;
margin-top: 30px;
}

#inmenu {
float: left;
width: 128px;
height: 298px;
border-top: 1px solid black;
border-right: 1px solid black;
border-bottom: 1px solid black;
}

#ininmenu {
float: left;
width: 128px;
height: 278px;
border-bottom: 1px solid black;
}

#content {
}

#nadpis {
font-weight: bold;
font-size: 20px;
font-style: italic;
}

#novinky {
width: 500px;
height: auto;
float: right;
margin-top: 10px;
}

#ndatum {
font-size: 11px;
height: 25px;
width: 100px;
margin-top: 5px;
margin-right: 10px;
float: right;
}

#ntext {
font-size: 12px;
margin-left: 15px;
clear: right;
}

#nautor {
width: 100px;
height: 20px;
float: right;
font-size: 12px;
}

#pc {
position: absolute;
left: 700px;
top: 700px;
}

#paticka {
clear: both;
width: auto;
height: auto;
padding: 3px 0 3px 0;
border-top: 1px solid black;
text-align: center;
}
/* end lay-out */


/* menu a paticka */
#menu ul { margin-right: 25px; } /* neprimo urci sirku seznamu */

#menu ul li { display: inline; } /* osetreni IE */

#menu ul li a {
display: block;
color: black;
width: 105px;
padding: 2px 0 2px 5px;
border-bottom: 1px solid black;
}

#menu ul li a:hover { color: white; }

#paticka ul li {
display: inline; /* radkovy seznam */
font-size: 0.9em;
}

/* end menu a paticka*/



/* nadpisy */

/* end nadpisy */



/* styl textu a odkazu */
a {
text-decoration: none;
padding: 1px;
color: black;
}

a:hover {
background: black;
color: white;
}

p {
text-align: justify;
padding: 0.5em 0 0.5em 0;
text-indent: 1em;
}

hr {
height: 1px;
color: black;
background-color: black;
border: 0px solid black;
clear: both;
margin-top: 10px;
}
/* end styl textu a odkazu */


Ještě ten IE píše chybu na řádku 661 znak 15 v tomto scriptu www.fifland.wz.cz/rounded-corners.inc.js
Stránky zde www.fifland.wz.cz

Nahlásit jako SPAM
IP: 87.249.133.–
Onsi0
Stálý člen
2. 12. 2007   #4
-
0
-

skús dať ku obrázkom z-index: 1
myslím že potom by mohli byť hore

#disketa {
position: absolute;
left: 115px;
top: 70px;
_left: 115px;
_top: 65px;
z-index: 1;
}

Nahlásit jako SPAM
IP: 91.127.11.–
Figa0
Super člen
2. 12. 2007   #5
-
0
-

Bezvadný funguje to.Děkuji ti moc.Teď ještě vyřešit ten IE6.Mohl by to prosím někdo zkusit v IE7?

Nahlásit jako SPAM
IP: 87.249.133.–
Onsi0
Stálý člen
2. 12. 2007   #6
-
0
-

v IE7 chýbaju zaoblene rohy a vrchná a spodná časť vonkajšieho rámu

Nahlásit jako SPAM
IP: 91.127.11.–
Figa0
Super člen
2. 12. 2007   #7
-
0
-

Ach jo, takže stejný problém jako v IE6.Kdybych se aspoň vyznal v JS.

Nahlásit jako SPAM
IP: 87.249.133.–
Onsi0
Stálý člen
2. 12. 2007   #8
-
0
-

no tak v tomto Ti nepomôžem js neviem...

Nahlásit jako SPAM
IP: 91.127.11.–
survik1
~ Moderátor
0
Posthunter
2. 12. 2007   #9
-
0
-

Dej dotaz do sekce JS, je zde pár schopných lidí ;)

Nahlásit jako SPAM
IP: 89.102.163.–
Život je jen hra, která se nedá vyhrát.
Zjistit počet nových příspěvků

Přidej příspěvek

Toto téma je starší jak čtvrt roku – přidej svůj příspěvek jen tehdy, máš-li k tématu opravdu co říct!

Ano, opravdu chci reagovat → zobrazí formulář pro přidání příspěvku

×Vložení zdrojáku

×Vložení obrázku

Vložit URL obrázku Vybrat obrázek na disku
Vlož URL adresu obrázku:
Klikni a vyber obrázek z počítače:

×Vložení videa

Aktuálně jsou podporována videa ze serverů YouTube, Vimeo a Dailymotion.
×
 
Podporujeme Gravatara.
Zadej URL adresu Avatara (40 x 40 px) nebo emailovou adresu pro použití Gravatara.
Email nikam neukládáme, po získání Gravatara je zahozen.
-
Pravidla pro psaní příspěvků, používej diakritiku. ENTER pro nový odstavec, SHIFT + ENTER pro nový řádek.
Sledovat nové příspěvky (pouze pro přihlášené)
Sleduj vlákno a v případě přidání nového příspěvku o tom budeš vědět mezi prvními.
Reaguješ na příspěvek:

Uživatelé prohlížející si toto vlákno

Uživatelé on-line: 0 registrovaných, 15 hostů

Podobná vlákna

 

Hostujeme u Českého hostingu       ISSN 1801-1586       ⇡ Nahoru Webtea.cz logo © 20032016 Programujte.com
Zasadilo a pěstuje Webtea.cz, šéfredaktor Lukáš Churý