Antworten auf deine Fragen:
Neues Thema erstellen

Lightbox2 erzeugt boder-bottom:dotted

tiroler

Hat es drauf

hi habe mir in eine site 3 Bilder mittels lightbox 2 eingefügt.

Nun passiert folgendes:
a) die Thumbnails erhalten einen Unterlinie gepunktet
b) der gesamte weitere siteinhalt erhält dies ebenfalls

siehe hier:




meine css dazu ( ich finds net ):
Code:
body {
        margin: 20px;
        background: #000E80;
        font-family: Verdana;
        font-size: 13px;
        color: #000000;
}

h1, h2, h3, h4, {
        margin: 0;
        font-family: Verdana;
        font-weight: normal;
        color: #000000;
}

h1 {
        font-size: 2em;
}

h2 {
        font-size: 1.6em;
}

h3 {
        font-size: 1.6em;
}

h4 {
        font-size: 1.2em;
}
p, ul, ol {
        margin-top: 0;
        line-height: 180%;
}

ul, ol {
}

a {
        text-decoration: none;
        border-bottom: 1px dotted #999999;
        color: #0A0A0A;
}

a:hover {
        background: none;
}

#wrapper {
        width: 910px;
        margin: 0 auto;
        padding: 10px;
        background: #fff994;
}

/* Header */

#header {
        width: 910px;
        height: 240px;
        margin: 0 auto;
        background: #fff994 url(images/header800.gif) no-repeat left top;
}

/* Logo */

#logo {
        float: left;
        width: 640px;
        color: #000000;
}

#logo h1, #logo p {
}

#logo h1 {
        float: left;
        padding: 70px 0 0 20px;
        letter-spacing: -1px;
        text-transform: uppercase;
        font-size: 2.6em;
}

#logo p {
        float: left;
        margin: 0;
        padding: 80px 0 0 5px;
        text-transform: uppercase;
        font: bold 14px Verdana;
}

#logo a {
        border: none;
        background: none;
        text-decoration: none;
        color: #FFFFFF;
}



/* Menu */

#menu {
        width: 910px;
        height: 50px;
        margin: 0 auto;
        padding: 0;
        border-top: 20px #fff994 solid;
        background: #f59603;
}

#menu ul {
        margin: 0;
        padding: 0;
        list-style: none;
        line-height: normal;
}

#menu li {
        float: left;
}

#menu a {
        display: block;
        padding: 17px 10px 10px 20px;
        text-transform: uppercase;
        text-decoration: none;
        font-family: Arial, Helvetica, sans-serif;
        font-size: 14px;
        font-weight: bold;
        color: #000000;
        border: none;
}

#menu a:hover, #menu .current_page_item a {
        color: #000000;
}

#menu a:hover {
        color: #ffffff;
}

<!--neuereintrag-->
#menue {
width: 150px;
font-size: 17px;
}
.menuekopf {
font-weight: bold;
color: #000000;
width: 150px;
padding: 5px;
border: 1px solid #000000;
}
#menue ul {
list-style-type: none;
padding: 0px;
border: 1px solid #000000;
margin: 2px 0px;
}
#menue li {
display: block;
}
#menue li a, #menue li a:link {
text-decoration: none;
display: block;
color: #000000;
width: 150px;
padding: 5px;
}
#menue li a:visited {
color: #0066FF;
background-color: #EBEBEB;
}

#menue li a:hover, #menue li a:active, #menue li a:focus {
color: #ffffff;
background-color: #f59603;
}

<!--neuer eintrag-->

/* Page */

#page {
        width: 910px;
        margin: 0 auto;
}

/* Content */

#content {
        float: right;
        width: 700px;
        padding: 0px 20px 20px 0 ;
}

.post {
}

.post .title {
        color: #000000;
}

.post .title a {
        background: none;
        color: #000000;
        border: none;
}

.post .title a:hover {
        text-decoration: underline;
}

.post .meta {
        border-bottom: 1px dashed #D2D4C9;
        text-transform: uppercase;
        text-align: left;
        font-family: Arial, Helvetica, sans-serif;
        font-size: 9px;
}

.post .entry {
        padding: 10px 0 20px 0;
        text-align: justify;
}

/* Sidebar */

#sidebar {
        float: left;
        width: 170px;
        padding: 20px 0 0 0px;
        color: #787878;
}

#sidebar ul {
        margin: 0;
        padding: 0;
        list-style: none;
}

#sidebar li {
}

#sidebar li ul {
        padding-bottom: 30px;
}

#sidebar li li {
        line-height: 35px;
        border-bottom: 1px dashed #D2D4C9;
}

#sidebar h2 {
        letter-spacing: -.5px;
        color: #000000;
}

#sidebar p {
        padding-bottom: 20px;
        text-align: justify;
}

#sidebar a {
        color: #787878;
        border: none;
}

#sidebar a:hover {
        text-decoration: underline;
        color: #787878;
}

/* Calendar */

#calendar {
}

#calendar_wrap {
        padding: 20px;
}

#calendar table {
        width: 100%;
}

#calendar tbody td {
        text-align: center;
}

#calendar #next {
        text-align: right;
}

/* Footer */

#footer {
        width: 910px;
        height: 20px;
        margin: 0 auto;
        padding: 20px 0 15px 0;
        background: #f59603;
        font-family: Arial, Helvetica, sans-serif;
        color: #000000;
}

#footer p {
        margin: 0;
        line-height: normal;
        font-size: 9px;
        text-transform: uppercase;
        text-align: center;
}

#footer a {
        color: #FFFFFF;
}
woran liegt das ?

das is es nicht
bei a
border-bottom: 1px dotted #999999;

hier noch ein LINK zur
 
Zuletzt bearbeitet:

M

micee

Guest

AW: Lightbox2 erzeugt boder-bottom:dotted

Hi,

erstmal Glückwunsch zu deiner Seite.

Du verwendtes als DOCTYPE XHTML 1.0 Strict

Da mußt du denn <a> tag natürlich auch mit </a> beenden. Bei dir ist jetzt der nachfolgende Text als Anker-Element definiert. Deshalb auch dotted unterstrichen.

Dann klappts auch.

Micha
 

cebito

undefined

AW: Lightbox2 erzeugt boder-bottom:dotted

Es liegt an dem; denn du schließt deine a-tags nicht... klick mal in deinen gedotteten Text und es wird sich die Lightbox öffnen...

Code:
<a href="http://www.psd-tutorials.de/modules/Forum/images/gro_DSC_0039.JPG" rel="lightbox[roadtrip]"><img src="http://www.psd-tutorials.de/modules/Forum/images/kl_gro_DSC_0039.JPG" width="200" height="133" border="0" alt="">[B][COLOR=Red]</a>[/COLOR][/B]
<a href="http://www.psd-tutorials.de/modules/Forum/images/gro_DSC_0082.JPG" rel="lightbox[roadtrip]"><img src="http://www.psd-tutorials.de/modules/Forum/images/kl_gro_DSC_0082.JPG" width="200" height="133" border="0" alt="">[B][COLOR=Red]</a>[/COLOR][/B]
<a href="http://www.psd-tutorials.de/modules/Forum/images/gro_DSC_0085.JPG" rel="lightbox[roadtrip]"><img src="http://www.psd-tutorials.de/modules/Forum/images/kl_gro_DSC_0085.JPG" width="200" height="133" border="0" alt="">[B][COLOR=Red]</a>[/COLOR][/B]
Das rote fehlt bei dir...

Edit: und für die Bilder, gib dem div eine id - bspw. lightbox, weil es so schön drüber steht und notiere in der css:

Code:
#lightbox a {
 border: none;
}
 
Zuletzt bearbeitet:

tiroler

Hat es drauf

AW: Lightbox2 erzeugt boder-bottom:dotted

ich danke Euch:
nach einiger Zeit im Quelltext wird man BLIND !!!!

Vielen Dank nochmal- das liebe ich an diesem spitzen Forum.
 

berta

Marina

AW: Lightbox2 erzeugt boder-bottom:dotted

Hi,

ich hab das gleiche problem wie der tiroler aber mein link endet mit </a>
und trotzdem habe ich die Punkte unter den Bildern (nicht unter dem Text)

hier mein code
<a href="images/gro_inforat1.JPG" rel="lightbox[roadtrip]"> <img src="images/klein-inforat1.JPG" width="100" height="66" border="1" title="die Badewanne"></a>

was mache ich falsch?

Danke
Berta
 

netbandit

Aktives Mitglied

AW: Lightbox2 erzeugt boder-bottom:dotted

Vermute mal es liegt am Leerschitt zwischen Link und Bild, allerdings sollten die Punkte dann nicht unbedingt unten drunter erscheinen; Hast Du mal ein Link zur Seite?
 

berta

Marina

AW: Lightbox2 erzeugt boder-bottom:dotted

ja hab einen link. ist die seite was der tiroler bereits nachgefragt hat, die punkte unter der schrift sind weg aber nicht unter den bildern.

Danke
berta
 

netbandit

Aktives Mitglied

AW: Lightbox2 erzeugt boder-bottom:dotted

na, dotted hast Du doch für Deine Links definiert:

:
HTML:
a {
        text-decoration: none;
        border-bottom: 1px dotted #999999;
        color: #0A0A0A;
}
Willst Du die Vorschaubilder davon ausschliessen, könntest Du ein DIV (id="lightbox") um den Bereich mit den Vorschaubildern setzen und in der
folgende Formatierungen nutzen/erweitern:

HTML:
#lightbox{    position: absolute;    left: 0; width: 100%; z-index: 100; text-align: center; line-height: 0;}
#lightbox img{ width: auto; height: auto;}
#lightbox a img{ border: none; }
 

berta

Marina

AW: Lightbox2 erzeugt boder-bottom:dotted

Hallo Netbandit

für den a tag ist folgendes im CSS eingegeben - deshalb die punkte!!

a {
text-decoration: none;
border-bottom: 1px dotted #999999;
color: #0A0A0A;
}



Danke
berta
 

berta

Marina

AW: Lightbox2 erzeugt boder-bottom:dotted

Hallo,

habs zusammengebracht - muss einfach die augen aufmachen - aber hab mich dermassen auf die lightbox versteift dass ich alles andere übersehen hab.

danke euch allen
berta
 
Bilder bitte hier hochladen und danach über das Bild-Icon (Direktlink vorher kopieren) platzieren.
Antworten auf deine Fragen:
Neues Thema erstellen

Willkommen auf PSD-Tutorials.de

In unseren Foren vernetzt du dich mit anderen Personen, um dich rund um die Themen Fotografie, Grafik, Gestaltung, Bildbearbeitung und 3D auszutauschen. Außerdem schalten wir für dich regelmäßig kostenlose Inhalte frei. Liebe Grüße senden dir die PSD-Gründer Stefan und Matthias Petri aus Waren an der Müritz. Hier erfährst du mehr über uns.

Stefan und Matthias Petri von PSD-Tutorials.de

Nächster neuer Gratisinhalt

03
Stunden
:
:
25
Minuten
:
:
19
Sekunden

Neueste Themen & Antworten

Flatrate für Tutorials, Assets, Vorlagen

Zurzeit aktive Besucher

Statistik des Forums

Themen
118.616
Beiträge
1.538.358
Mitglieder
67.536
Neuestes Mitglied
QuestionMark
Oben