Avatar billede mads375 Juniormester
10. februar 2008 - 14:16 Der er 20 kommentarer og
1 løsning

border bottom i css

Hejsa.

Jeg vil gerne have en border-bottom på 5 px i mine <td>èr. Altså en border på undersiden af min <td>.
Jeg har lavet det i et eksternt dokument og alt andet virker undtagen border-bottom: medium;

Hvordan kan det være??
Avatar billede olebole Juniormester
10. februar 2008 - 14:20 #1
<ole>

Jeg tror, du har en fejl i linje 28. Mangler du ikke et semikolon dér?  ;o)

/mvh
</bole>
Avatar billede olebole Juniormester
10. februar 2008 - 14:21 #2
hint: Kun du kan se koden  =)
Avatar billede mads375 Juniormester
10. februar 2008 - 14:22 #3
hej igen olebole:-)

min css kode er:

a:link        {
                color: #6c6c6c;
                text-decoration: none;
                background-color: #f9f6ef;
                font: Myriad Pro;
                border-bottom: medium;
}

a:visited    {
                color: #6c6c6c;
                text-decoration: none;
                background-color: #f9f6ef;
                font: Myriad Pro;               
                border-bottom: medium;
}

a:active        {
                color: #b4b4b4;
                text-decoration: none;
                background-color: #f9f6ef;       
                font: Myriad Pro;       
                border-bottom: medium;   
}               

a:hover        {
                color: #b4b4b4;
                text-decoration: none;
                background-color: #f9f6ef;               
                font: Myriad Pro;   
                border-bottom: medium;
               
}

.links        {
               
                background-color: #f9f6ef;
                border-bottom: medium;
                               
}



det er det sidste jeg mangler for at blive færdig, håber det lykkedes:-)
Avatar billede mads375 Juniormester
10. februar 2008 - 14:24 #4
og html:

hvor jeg gerne vil have border bottom:

<td class="links" width="166" rowspan="2" align="left" valign="top">
<table width="169" border="0" cellpadding="0" cellspacing="0">
<tr>
                  <td width="169" align="left"><div align="left">
                    <blockquote>&nbsp;</blockquote>
                  </div></td>
</tr>
                                <tr>
                                    <td><div align="left">
                                      <blockquote>&nbsp;</blockquote>
                                    </div></td>
</tr>
                                <tr>
                                    <td>&nbsp;</td>
</tr>
                                <tr>
                                    <td>&nbsp;</td>
                </tr>
                                <tr>
                                    <td>&nbsp;</td>
                </tr>
                                <tr>
                                    <td>&nbsp;</td>
                </tr>
                                <tr>
                                    <td>&nbsp;</td>
                </tr>
                                <tr>
                                    <td>&nbsp;</td>
                                </tr>
                                <tr>
                                    <td>&nbsp;</td>
                </tr>
                                <tr>
                                  <td>&nbsp;</td>
                                </tr>
                                <tr>
                                  <td>&nbsp;</td>
                                </tr>
                                <tr>
                                  <td>&nbsp;</td>
                                </tr>
                                <tr>
                                  <td>&nbsp;</td>
                                </tr>
            </table>                        </td>
Avatar billede mads375 Juniormester
10. februar 2008 - 15:02 #5
nej ole, nu forsvandt du jo:-)
Avatar billede windcape Praktikant
10. februar 2008 - 15:05 #6
td {
    border-bottom: 5px solid black;
}

... hvad var problemet?
Avatar billede mads375 Juniormester
10. februar 2008 - 15:08 #7
at når jeg skrev det i mit css dokument skete der ikke noget når jeg oprettede et link, der skulle jo gerne komme border på, men det gør der ikke, men alt andet i css dokumentet virker??
Avatar billede windcape Praktikant
10. februar 2008 - 15:10 #8
Hvad med at du poster HELE dit html dokument så? Du har jo tydeligvis gjort noget forkert, og jeg gider ikke til at lege gætteleg.
Avatar billede mads375 Juniormester
10. februar 2008 - 15:13 #9
det kan jeg da egentligt godt forstå. ligger det her, håber du har en ide:


<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" >
<head>
    <title>index</title>
    <link rel="stylesheet" type="text/css" href="css/billeder.css">
   
<style type="text/css">
<!--
.style2 {font-size: 12px}
-->
</style>
<script type="text/javascript">
<!--
function MM_swapImgRestore() { //v3.0
  var i,x,a=document.MM_sr; for(i=0;a&&i<a.length&&(x=a[i])&&x.oSrc;i++) x.src=x.oSrc;
}
function MM_preloadImages() { //v3.0
  var d=document; if(d.images){ if(!d.MM_p) d.MM_p=new Array();
    var i,j=d.MM_p.length,a=MM_preloadImages.arguments; for(i=0; i<a.length; i++)
    if (a[i].indexOf("#")!=0){ d.MM_p[j]=new Image; d.MM_p[j++].src=a[i];}}
}

function MM_findObj(n, d) { //v4.01
  var p,i,x;  if(!d) d=document; if((p=n.indexOf("?"))>0&&parent.frames.length) {
    d=parent.frames[n.substring(p+1)].document; n=n.substring(0,p);}
  if(!(x=d[n])&&d.all) x=d.all[n]; for (i=0;!x&&i<d.forms.length;i++) x=d.forms[i][n];
  for(i=0;!x&&d.layers&&i<d.layers.length;i++) x=MM_findObj(n,d.layers[i].document);
  if(!x && d.getElementById) x=d.getElementById(n); return x;
}

function MM_swapImage() { //v3.0
  var i,j=0,x,a=MM_swapImage.arguments; document.MM_sr=new Array; for(i=0;i<(a.length-2);i+=3)
  if ((x=MM_findObj(a[i]))!=null){document.MM_sr[j++]=x; if(!x.oSrc) x.oSrc=x.src; x.src=a[i+2];}
}
//-->
</script>
<script language="JavaScript1.1">
<!--


// Mili sekund mellem billederne
var slidespeed=3000

//specifikke images
var slideimages=new Array("img/slideshow/Billede1.jpg","img/slideshow/Billede2.jpg","img/slideshow/Billede3.jpg","img/slideshow/Billede4.jpg","img/slideshow/Billede5.jpg","img/slideshow/Billede6.jpg","img/slideshow/Billede7.jpg")

var imageholder=new Array()
var ie=document.all
for (i=0;i<slideimages.length;i++){
imageholder[i]=new Image()
imageholder[i].src=slideimages[i]
}
function MM_swapImgRestore() { //v3.0
  var i,x,a=document.MM_sr; for(i=0;a&&i<a.length&&(x=a[i])&&x.oSrc;i++) x.src=x.oSrc;
}
function MM_findObj(n, d) { //v4.01
  var p,i,x;  if(!d) d=document; if((p=n.indexOf("?"))>0&&parent.frames.length) {
    d=parent.frames[n.substring(p+1)].document; n=n.substring(0,p);}
  if(!(x=d[n])&&d.all) x=d.all[n]; for (i=0;!x&&i<d.forms.length;i++) x=d.forms[i][n];
  for(i=0;!x&&d.layers&&i<d.layers.length;i++) x=MM_findObj(n,d.layers[i].document);
  if(!x && d.getElementById) x=d.getElementById(n); return x;
}

function MM_swapImage() { //v3.0
  var i,j=0,x,a=MM_swapImage.arguments; document.MM_sr=new Array; for(i=0;i<(a.length-2);i+=3)
  if ((x=MM_findObj(a[i]))!=null){document.MM_sr[j++]=x; if(!x.oSrc) x.oSrc=x.src; x.src=a[i+2];}
}
//-->
</script>
<link href="css/links.css" rel="stylesheet" type="text/css" />
<style type="text/css">
<!--
.style4 {font-size: 13px}
-->
</style>
</head>
<body class="baggrund" onload="MM_preloadImages('img/orienteringslobefter.jpg','img/adventureefter.jpg','img/friluftslivefter.jpg','img/hesteefter.jpg','img/naturvejlederefter.jpg','img/friluftsgardefter.jpg','img/nuvarendeholdefter.jpg','img/forsideorange.jpg','img/undervisningorange.jpg','img/galleriorange.jpg','img/infoorange.jpg','img/tilmeldingorange.jpg')">
<center>
    <table cellpadding="0" cellspacing="0" border="0" width="728">
<tr>
            <td colspan="2" align="left">
<table cellpadding="0" cellspacing="0" border="0">
                    <tr>
                        <td class="banner1" align="left" colspan="6">&nbsp;</td>
                  </tr>
                    <tr>
                        <td width="410" class="banner2" style="width: 410px;" cellpadding="0" cellspacing="0">&nbsp;</td>
                      <td width="58"><a href="index.htm" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('Image10','','img/forsideorange.jpg',1)"><img src="img/forside.jpg" name="Image10" width="58" height="53" border="0" id="Image10" /></a></td>
                      <td width="82"><a href="undervisning/undervisning.html" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('Image11','','img/undervisningorange.jpg',1)"><img src="img/undervisning.jpg" name="Image11" width="82" height="53" border="0" id="Image11" /></a></td>
                      <td width="57"><a href="galleri/galleri.html" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('Image12','','img/galleriorange.jpg',1)"><img src="img/galleri.jpg" name="Image12" width="57" height="53" border="0" id="Image12" /></a></td>
                      <td width="57"><a href="info/info.html" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('Image13','','img/infoorange.jpg',1)"><img src="img/info.jpg" name="Image13" width="57" height="53" border="0" id="Image13" /></a></td>
                      <td width="66"><a href="tilmelding.html" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('Image14','','img/tilmeldingorange.jpg',1)"><img src="img/tilmelding.jpg" name="Image14" width="66" height="53" border="0" id="Image14" /></a></td>
</tr>
                    <tr>
                        <td colspan="6" align="left">
                      <table cellpadding="0" cellspacing="0" border="0">
                                <tr>
                                    <td width="550" height="139" rowspan="3" valign="top" style="width: 550px;"></a><img src="index/Billede1.jpg" name="slide" width=550 height=139 border=0 align="top" style="filter:blendTrans(duration=3)"></a>

<script language="JavaScript1.1">
<!--

var whichlink=0
var whichimage=0
var blenddelay=(ie)? document.images.slide.filters[0].duration*1000 : 0
function slideit(){
if (!document.images) return
if (ie) document.images.slide.filters[0].apply()
document.images.slide.src=imageholder[whichimage].src
if (ie) document.images.slide.filters[0].play()
whichlink=whichimage
whichimage=(whichimage<slideimages.length-1)? whichimage+1 : 0
setTimeout("slideit()",slidespeed+blenddelay)
}
slideit()

//-->
</script>
                              <td class="bgcolor" width="180" height="28" valign="top"><a href="index/Nuvarendehold.html" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('Nuvarende Hold','','img/nuvarendeholdefter.jpg',1)"><img src="img/nuvarendehold.jpg" alt="nuværende hold" name="Nuvarende Hold" width="180" height="25" border="0" id="Nuvarende Hold" /></a></td>
                        </tr>
                                <tr>
                                  <td class="bgcolor"img src="nuvarendehold.jpg" height="111" width="180" valign="top" alt="nuværende hold"><div align="center"><img src="img/nuvaerendeelever.jpg" alt="nuværende hold" width="134" height="100" align="absmiddle"/></div></td>
                        </tr>
                          </table>                        </td>
                    </tr>
                    <tr>
                        <td class="vstreg" colspan="6"></td>
                  </tr>
          </table>            </td>
      </tr>
        <tr>
            <td colspan="2">
                <table cellpadding="0" cellspacing="0" border="0" width="730">
<tr>
                        <td class="links" width="166" rowspan="2" align="left" valign="top">
<table width="169" border="0" cellpadding="0" cellspacing="0">
<tr>
                  <td width="169" align="left">&nbsp;</td>
</tr>
                                <tr>
                                    <td><div align="left">
                                      <blockquote>&nbsp;</blockquote>
                                    </div></td>
</tr>
                                <tr>
                                    <td>&nbsp;</td>
</tr>
                                <tr>
                                    <td>&nbsp;</td>
                </tr>
                                <tr>
                                    <td>&nbsp;</td>
                </tr>
                                <tr>
                                    <td>&nbsp;</td>
                </tr>
                                <tr>
                                    <td>&nbsp;</td>
                </tr>
                                <tr>
                                    <td>&nbsp;</td>
                                </tr>
                                <tr>
                                    <td>&nbsp;</td>
                </tr>
                                <tr>
                                  <td>&nbsp;</td>
                                </tr>
                                <tr>
                                  <td>&nbsp;</td>
                                </tr>
                                <tr>
                                  <td>&nbsp;</td>
                                </tr>
                                <tr>
                                  <td>&nbsp;</td>
                                </tr>
            </table>                        </td>
            <td class="lstreg" width="10" rowspan="2" align="left" valign="top">&nbsp;</td>
            <td class="bgcolor" colspan="4" align="left" valign="top"><p>&nbsp;</p>
                        <p>&nbsp;</p>
                        <p>&nbsp;</p>
            <p>&nbsp;</p>
            <p>&nbsp;</p>
            <p>&nbsp;</p></td>
                  <td class="bgcolor" width="168" align="right" valign="top">
                    <p>&nbsp;</p>
                    <table cellpadding="0" cellspacing="0" border="0">
                                <tr>
                                    <td width="124"><a href="http://www.friluftsgard.dk/naturvejleder.htm" target=_blank" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('naturvejleder','','img/naturvejlederefter.jpg',1)"><img src="img/naturvejleder.jpg" alt="naturvejleder" name="naturvejleder" width="124" height="38" border="0" id="naturvejleder" /></a></td>
                      </tr>
                                <tr>
                                    <td><a href="http://www.friluftsgard.dk/" target="_blank" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('friluftsgaard','','img/friluftsgardefter.jpg',1)"><img src="img/friluftsgard.jpg" alt="friluftsgaard" name="friluftsgaard" width="124" height="49" border="0" id="friluftsgaard" /></a></td>
                                </tr>
                                <tr>
                                    <td>&nbsp;</td>
                                </tr>
            </table>                        </td>
                  </tr>
                    <tr>
                      <td width="135" height="131" align="left" valign="top"><a href="undervisning/orienteringslob.html" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('orienteringslob','','img/orienteringslobefter.jpg',1)"><img src="img/orienteringslob.jpg" alt="orienteringsløb" name="orienteringslob" width="135" height="131" border="0" id="orienteringslob" /></a></td>
                      <td width="131" align="left" valign="top"><a href="undervisning/adventure.html" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('adventure','','img/adventureefter.jpg',1)"><img src="img/adventure.jpg" alt="adventurerace" name="adventure" width="131" height="131" border="0" id="adventure" /></a></td>
                      <td width="125" align="left" valign="top"><a href="undervisning/friluftsliv.html" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('friluftsliv','','img/friluftslivefter.jpg',1)"><img src="img/friluftsliv.jpg" alt="friluftsliv" name="friluftsliv" width="125" height="131" border="0" id="friluftsliv" /></a></td>
                      <td width="1" align="left" valign="top"><a href="undervisning/heste.html" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('heste','','img/hesteefter.jpg',1)"></a></td>
                      <td class="bgcolor" width="168" align="right" valign="top"><div align="left"><a href="undervisning/heste.html" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('heste','','img/hesteefter.jpg',1)"><img src="img/heste.jpg" alt="heste" name="heste" width="167" height="131" border="0" id="heste" /></a></div></td>
                  </tr>
          </table>            </td>
        </tr>
        <tr>
          <td width="175" align="center" class="bgbund">&nbsp;</td>
          <td width="557" align="center" class="bgbund"><div align="left">
            <div align="left" class="style2"> Himmelbjergegnens Natur &amp; Idr&aelig;tsefterskole - Vesterled 1 - Tlf: 86898399 -<span class="style4"><a href="mailto:gitte.isager@himmelbjergegnens.dk?subject=ang:&body=Til Himmelbjergegnens Natur og Idrætsefterskole." class="style2"><u> gitte.isager@himmelbjergegnens.dk</u></a></span></div>
          </div></td>
      </tr>
  </table>
</center>
</body>
</html>
Avatar billede mads375 Juniormester
10. februar 2008 - 15:14 #10
og det eksterne stylesheet:

a:link        {
                color: #6c6c6c;
                text-decoration: none;
                background-color: #f9f6ef;
                font: Myriad Pro;
                border-bottom: medium;
}

a:visited    {
                color: #6c6c6c;
                text-decoration: none;
                background-color: #f9f6ef;
                font: Myriad Pro;               
                border-bottom: medium;
}

a:active        {
                color: #b4b4b4;
                text-decoration: none;
                background-color: #f9f6ef;       
                font: Myriad Pro;       
                border-bottom: medium;   
}               

a:hover        {
                color: #b4b4b4;
                text-decoration: none;
                background-color: #f9f6ef;               
                font: Myriad Pro;   
                border-bottom: medium;
               
}

.links        {
    background-color: #f9f6ef;
    border-bottom: medium;
}
Avatar billede mads375 Juniormester
10. februar 2008 - 15:23 #11
det virker nu, men den sætter en streg i bunden af mine table, når jeg opretter et link og det skulle gerne være sådan at dem jeg laver hjemmesiden til at når de opretter et nyt link i <td> at der så kommer en understreg.
Avatar billede mads375 Juniormester
10. februar 2008 - 17:11 #12
hej igen.
Jeg bliver nød til at oprette et nyt spørgsmål, da siden skal udgives imorgen, så jeg har meget travlt.
Ligger i ikke et svar..
Avatar billede olebole Juniormester
10. februar 2008 - 17:28 #13
.links td        {
    background-color: #f9f6ef;
    border-bottom: medium;
}

- det skal vel gælde alle td'erne under den td, der har klassen 'links'  :)
Avatar billede mads375 Juniormester
10. februar 2008 - 17:44 #14
Det der bare er mærkeligt at jeg har sat min td til class="links"

<td class="links" width="166" rowspan="2" align="left" valign="top">
<table width="169" border="0" cellpadding="0" cellspacing="0">
<tr>
                  <td width="169" align="left">&nbsp;</td>
</tr>
                                <tr>
                                    <td><div align="left">
                                      <blockquote>&nbsp;</blockquote>
                                    </div></td>
</tr>
                                <tr>
                                    <td>&nbsp;</td>
</tr>
                                <tr>
                                    <td>&nbsp;</td>
                </tr>
                                <tr>
                                    <td>&nbsp;</td>
                </tr>
                                <tr>
                                    <td>&nbsp;</td>
                </tr>
                                <tr>
                                    <td>&nbsp;</td>
                </tr>
                                <tr>
                                    <td>&nbsp;</td>
                                </tr>
                                <tr>
                                    <td>&nbsp;</td>
                </tr>
                                <tr>
                                  <td>&nbsp;</td>
                                </tr>
                                <tr>
                                  <td>&nbsp;</td>
                                </tr>
                                <tr>
                                  <td>&nbsp;</td>
                                </tr>
                                <tr>
                                  <td>&nbsp;</td>
                                </tr>
Avatar billede olebole Juniormester
10. februar 2008 - 22:57 #15
- men har du skrevet præcis, som jeg gjorde i (10/02-2008 17:28:51)?
Avatar billede olebole Juniormester
10. februar 2008 - 23:07 #16
Med den kode, jeg har skrevet, får alle cellerne i den indre tabel en bund-border.

Med CSS kan du ikke diskriminere mellem celler, der indeholder et bestemt tag - og celler, der ikke gør. Du kan altså ikke nøjes med at 'understrege' celler, der indeholder et link.

Hvis det er det, du vil, må du manuelt sætte en klasse på cellen, når du skriver et link i den. Denne klasse kan så sætte bund-border på cellen. Du kan ikke gøre det automatisk
Avatar billede olebole Juniormester
10. februar 2008 - 23:10 #17
.blabla div {
    /* style regler */
}

- tager fat i alle div, der befinder sig i et element med klassen 'blabla'.

Det omvendte er ikke muligt. Du kan altså ikke adressere alle elementer med klassen 'blabla', som indeholder et div
Avatar billede roenving Novice
12. februar 2008 - 17:36 #18
-- endnu !-)
Avatar billede olebole Juniormester
12. februar 2008 - 20:07 #19
- suffløren er en overset og stærkt undervurderet person!  ;o)

Som roenving antyder, er det én af de ting, der ventes på ... udvikling og ikke mindst implementering af CSS tager tid  :o|
Avatar billede mads375 Juniormester
08. november 2008 - 15:05 #20
en der ligger et svar??
Avatar billede mads375 Juniormester
26. juli 2009 - 17:07 #21
Da der ikke er kommet et svar, tager jeg poitene her igen. Skriv hvis det ikke er ok?

Med Venlig Hilsen
Mads
Avatar billede Ny bruger Nybegynder

Din løsning...

Tilladte BB-code-tags: [b]fed[/b] [i]kursiv[/i] [u]understreget[/u] Web- og emailadresser omdannes automatisk til links. Der sættes "nofollow" på alle links.

Loading billede Opret Preview
Kategori
Vi tilbyder markedets bedste kurser inden for webudvikling

Log ind eller opret profil

Hov!

For at kunne deltage på Computerworld Eksperten skal du være logget ind.

Det er heldigvis nemt at oprette en bruger: Det tager to minutter og du kan vælge at bruge enten e-mail, Facebook eller Google som login.

Du kan også logge ind via nedenstående tjenester