Jump to content
eyexro

CSS3 on IE

Recommended Posts

Am adaugat niste elemente CSS3 pentru a accentua ideea designului si la internet explorer.. pica cerul X(

# Google Chrome

90d19e7cbb.png

Cod CSS Normal -

[COLOR="#FF8C00"]dl
{
padding: 10px;
min-width: 750px;
}
dl dt
{
-webkit-border-radius: 5px;
-moz-border-radius: 5px;
border: 1px solid #cccccc;
margin: 0;
}
dl dt a
{
color: #22b0e2;
font-weight: bold;
text-decoration: none;
padding: 10px;
display: block;
}
dl dd
{
color: #cccccc;
margin: 0;
height: 0;
overflow: hidden;
-webkit-transition: height 1s ease;
}
dl dd p
{
padding: 10px;
margin: 0;
}
dl dd:target
{
height: auto;
}
dl a.ie:hover dd,
dl a.ie:focus dd
{
height: auto;
color: #cccccc !important;
}

@media (-webkit-transition) {
dl dd:target
{
height: 10 px;
}
}[/COLOR]

# Internet Explorer

19ddfb88dc.png

Cod CSS- IE

[COLOR="#FF8C00"]/* CSS IE Accordion styles */
dl a.ie { text-decoration: none; }
dl a.ie dd { display: none; }

/* Fix IE6 hover bug */
dl a.ie:hover { background-color: #606061 !important; }

dl a.ie dt
{
color: #22b0e2;
font-weight: bold;
text-decoration: none;
padding: 10px;
display: block;
}

dl a.ie:hover dd,
dl a.ie:active dd,
dl a.ie:focus dd
{
height: auto;
color: #cccccc !important;
display: block;
[/COLOR]}

# Iar in index.html

[COLOR="#FFD700"]<h2>Structura cursuri</h2>
<dl>
<!--[if IE]>
<a href="#Section1" class="ie"><div>
<![endif]-->
<dt><!--[if !IE]>--><a href="#Section1"><!--<![endif]-->Section 1<!--[if !IE]>--></a><!--<![endif]--></dt>
<dd id="Section1">
<p>
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Proin consectetur, ante non iaculis suscipit, massa tortor dictum massa, mattis iaculis massa odio sit amet ipsum. Integer posuere enim ac felis feugiat auctor. Ut urna dui, mollis hendrerit fermentum non, lacinia non enim. Vestibulum lacus risus, tempor vel egestas at, laoreet id tortor. Cras augue sapien, cursus in facilisis id, bibendum a enim. Curabitur semper ligula et ligula aliquet scelerisque. Nunc quis aliquet sem. Duis a rhoncus enim. Integer lacinia, mi.
</p>
</dd>
<!--[if IE]>
</div></a>
<![endif]-->

<!--[if IE]>
<a href="#Section2" class="ie"><div>
<![endif]-->
<dt><!--[if !IE]>--><a href="#Section2"><!--<![endif]-->Section 2<!--[if !IE]>--></a><!--<![endif]--></dt>
<dd id="Section2">
<p>
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Proin consectetur, ante non iaculis suscipit, massa tortor dictum massa, mattis iaculis massa odio sit amet ipsum. Integer posuere enim ac felis feugiat auctor. Ut urna dui, mollis hendrerit fermentum non, lacinia non enim. Vestibulum lacus risus, tempor vel egestas at, laoreet id tortor. Cras augue sapien, cursus in facilisis id, bibendum a enim. Curabitur semper ligula et ligula aliquet scelerisque. Nunc quis aliquet sem. Duis a rhoncus enim. Integer lacinia, mi.
</p>
</dd>
<!--[if IE]>
</div></a>
<![endif]-->

<!--[if IE]>
<a href="#Section3" class="ie"><div>
<![endif]-->
<dt><!--[if !IE]>--><a href="#Section3"><!--<![endif]-->Section 3<!--[if !IE]>--></a><!--<![endif]--></dt>
<dd id="Section3">
<p>
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Proin consectetur, ante non iaculis suscipit, massa tortor dictum massa, mattis iaculis massa odio sit amet ipsum. Integer posuere enim ac felis feugiat auctor. Ut urna dui, mollis hendrerit fermentum non, lacinia non enim. Vestibulum lacus risus, tempor vel egestas at, laoreet id tortor. Cras augue sapien, cursus in facilisis id, bibendum a enim. Curabitur semper ligula et ligula aliquet scelerisque. Nunc quis aliquet sem. Duis a rhoncus enim. Integer lacinia, mi.
</p>
</dd>
<!--[if IE]>
</div></a>
<![endif]-->

<!--[if IE]>
<a href="#Section4" class="ie"><div>
<![endif]-->
<dt><!--[if !IE]>--><a href="#Section4"><!--<![endif]-->Section 4<!--[if !IE]>--></a><!--<![endif]--></dt>
<dd id="Section4">
<p>
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Proin consectetur, ante non iaculis suscipit, massa tortor dictum massa, mattis iaculis massa odio sit amet ipsum. Integer posuere enim ac felis feugiat auctor. Ut urna dui, mollis hendrerit fermentum non, lacinia non enim. Vestibulum lacus risus, tempor vel egestas at, laoreet id tortor. Cras augue sapien, cursus in facilisis id, bibendum a enim. Curabitur semper ligula et ligula aliquet scelerisque. Nunc quis aliquet sem. Duis a rhoncus enim. Integer lacinia, mi.
</p>
</dd>
<!--[if IE]>
</div></a>
<![endif]-->
<dt><!--[if !IE]>--><a href="#Section5"><!--<![endif]-->Section 5<!--[if !IE]>--></a><!--<![endif]--></dt>
<dd id="Section5">
<p>
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Proin consectetur, ante non iaculis suscipit, massa tortor dictum massa, mattis iaculis massa odio sit amet ipsum. Integer posuere enim ac felis feugiat auctor. Ut urna dui, mollis hendrerit fermentum non, lacinia non enim. Vestibulum lacus risus, tempor vel egestas at, laoreet id tortor. Cras augue sapien, cursus in facilisis id, bibendum a enim. Curabitur semper ligula et ligula aliquet scelerisque. Nunc quis aliquet sem. Duis a rhoncus enim. Integer lacinia, mi.
</p>
</dd>
<!--[if IE]>
</div></a>
<![endif]-->
<dt><!--[if !IE]>--><a href="#Section6"><!--<![endif]-->Section 6<!--[if !IE]>--></a><!--<![endif]--></dt>
<dd id="Section6">
<p>
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Proin consectetur, ante non iaculis suscipit, massa tortor dictum massa, mattis iaculis massa odio sit amet ipsum. Integer posuere enim ac felis feugiat auctor. Ut urna dui, mollis hendrerit fermentum non, lacinia non enim. Vestibulum lacus risus, tempor vel egestas at, laoreet id tortor. Cras augue sapien, cursus in facilisis id, bibendum a enim. Curabitur semper ligula et ligula aliquet scelerisque. Nunc quis aliquet sem. Duis a rhoncus enim. Integer lacinia, mi.
</p>
</dd>
<!--[if IE]>
</div></a>
<![endif]-->



</dl>[/COLOR]

Ce trebuie modificat sau adaugat ??

Link to comment
Share on other sites

Nu stii sa descrii problema. Dar din ce am vazut vrei sa faci un accordion menu. Nu am editat codul tau pentru ca este prea urat (mai ales comentariile alea pt. msie.). In schimb am facut o versiune mai curata si care merge in msie.

http://1582.tk/dt.html /

 CSS Accordion. - Pastebin.com

# daca vrei si alte efecte, Search The Fucking Web.

Edited by JohnDoe
Link to comment
Share on other sites

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.

Guest
Reply to this topic...

×   Pasted as rich text.   Paste as plain text instead

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.



×
×
  • Create New...