HOME | DD
RunaryKat — Window in your journal
Published: 2007-02-28 15:45:08 +0000 UTC; Views: 11916; Favourites: 232; Downloads: 352
Redirect to original
Description
YOU MUST PUT THIS TEXT IN THE BOX THAT SAYS "CSS (beta)" IN YOUR JOURNAL. THIS DEFINE THE WINDOW'S PROPERTIES.
ÉSTE TEXTO DEBES PONERLO EN LA CAJA QUE DICE "CSS BETA" DE TU JOURNAL. ES LO QUE LE DA LAS PROPIEDADES A LA VENTANA Y EL TÍTULO.div.window {
background-attachment: scroll;
width:200px;
height:150px;
border-width: 0px 4px 4px 4px;
border-color: #d3539b;
border-style: solid;
padding: 20px 10px 10px 10px;
margin-top: -15px;
background-color: #d3539b;
overflow: auto;
}
div.titlewindow {
height: 23px;
width:240px;
background-position: top left;
background-color: #d3539b;
padding-top: 7px;
font-size: 12px;
font-weight: bold;
color: #FFFFFF;
overflow: hidden;
}
---------- EXPLICACIÓN -------
div.window
background-attachment: scroll; // Es lo que hace que tenga barra desplazadora
width:200px; // Ancho de la ventana
height:150px; // Alto de la ventana
border-width: 0px 4px 4px 4px; // Con esto determinas el ancho de cada uno de los bordes
border-color: #d3539b; // Color del borde
border-style: solid; // Estilo del borde puede ser solid, dotted, dashed, double, groove, ridge, inset, outset pruebalos todos
padding: 20px 10px 10px 10px; // Los margenes internos de cada laddo de la ventana
margin-top: -15px; // Es el margen externo superior en mi caso es lo que hace que la ventana se junte con el título.
background-color: #d3539b; // Color de fondo de la ventana
overflow: auto; // Esto es lo que hace que si el contenido exede el area del div aparesca una barra desplazadora, je >_>
---------
div.titlewindow
height: 23px; // Alto de la barra de título
width:240px; // Ancho
background-position: top left; // Posiciona el fondo ariba y a la izquierda
background-color: #d3539b; // Color de fondo
padding-top: 7px; // Margen interno superior
font-size: 12px; // Tamaño de la letra en pixeles
font-weight: bold; // Si la letra es negrita o no. Bold= negrita , normal= normal
color: #FFFFFF; // Color de la letra
overflow:hidden; // Oculta el contenido del título si es demasiado largo para el area definida en los primeros don renglones
---------- PART BY PART -------
div.window
background-attachment: scroll; // this makes the window scrollable
width:200px; // windows width
height:150px; // windows height
border-width: 0px 4px 4px 4px; // Obvious xD
border-color: #d3539b; // Border color
border-style: solid; // Can be solid, dotted, dashed, double, groove, ridge, inset, outset... try all!
padding: 20px 10px 10px 10px; // Internal margins
margin-top: -15px; // External margin on top
background-color: #d3539b; // U know xDu
overflow: auto; // it shows scrollbars if the content doesn't fit the container
---------
div.titlewindow
height: 23px; // U know
width:240px; // U know
background-position: top left; // Put background on top left
background-color: #d3539b; // you know
padding-top: 7px; // Internal top margin
font-size: 12px; // Hehe
font-weight: bold; // Can be bold, normal or bolder
color: #FFFFFF; // Font color
overflow:hidden; // it hides the content that doesn't fit the container
-----------------------------------------------------------
PUT THIS IN THE PLACE YOU WANT THE WINDOW APPEAR ESTO LO PONES EN EL LUGAR DONDE QUIERAS QUE APARESCA LA VENTANA-----------------------------------------------------------
ANY QUESTIONS ? LEAVE A COMMENT
CUALQUIER PREGUNTA DEJALA EN LOS COMENTARIOS n.nU
Related content
Comments: 203
Hmmmmmmm what do you put in which place?
👍: 0 ⏩: 1
I just put all of it in the CSS txt like this for example:
div.window {
background-attachment: scroll;
width:200px;
height:150px;
border-width: 0px 4px 4px 4px;
border-color: #d3539b;
border-style: solid;
padding: 20px 10px 10px 10px;
margin-top: -15px;
background-color: #d3539b;
overflow: auto;
}
div.titlewindow {
height: 23px;
width:240px;
background-position: top left;
background-color: #d3539b;
padding-top: 7px;
font-size: 12px;
font-weight: bold;
color: #FFFFFF;
overflow: hidden;
}
/FAIL lol
👍: 0 ⏩: 1
All the text between "{}" goes into "CSS" box
The rest of the text goes into the HTML box (I guess is below the CSS box)
"The rest of the text" is this:
👍: 0 ⏩: 1
Oh thankyou <3
It worked! Im so excited! lol /slapped
👍: 0 ⏩: 1
HELP!!! 
👍: 0 ⏩: 1
How big thumbnail? can you show me an example? Did you see before a deviant journal with that kind of thumbnail?
👍: 0 ⏩: 1
nvm I found it.. finally but omg it was a challenge on how to find it...
< div >< a href="url of the image here, and keep the quotation marks" >< img src="right click on the picture, click Copy Image Location, and then paste here. Keep the quotation marks" width="however many pixels you want, I use 300 or 400, and keep the quotation marks" > < /a >< /div >
without spaces of course...
👍: 0 ⏩: 1
awesome!!!
its so eazy when you explain it like this xDD
i got a question..
if i want to put a picture [a little one] in the title.. how do i do that..?
👍: 0 ⏩: 1
What kind of picture? A deviant art thumbnail or something else?
👍: 0 ⏩: 1
from photobucket~ ^^
i made the title in the photoshop
👍: 0 ⏩: 1
ok, send me a note whit the URL (direct link) of that image and I will sen you back the code whit the image.
👍: 0 ⏩: 1
uhmm.. as the title of the box
👍: 0 ⏩: 1
Sorry there were a spare character (I dunno why appeared in the sent note, in the preview doesn't shows it).
Just replace "WINDOW'S TITLE" whit:![](\"http://i159.photobucket.com/albums/t134/shushi05/my%20C%20art/feature.png\")
That spare character is still here!!! I cant believe it :S. Plase take off the \ betwen the = and " :S. Can you?
If this doesn't works please tellme what happened, exactly
👍: 0 ⏩: 1
err.. now the photo is doing problems x:
sorry for all the trouble T.T
👍: 0 ⏩: 1
try to do it on your journal and press preview o.o [hard to explain]
👍: 0 ⏩: 1
I'm not premium account I cant see x_x. I gotta go right now, but you can take a screen shot for showing me what's happening, look:
Press "impr pant/Pet sis" Key on your keyboard (it's on the right top corner). Open the software "Paint" (in accesories of windows) or photoshop and press ctrl+v (paste it). Then save the image as a .jpg and upload it the same way you uploaded the other image. Then you can show me.
I will back latter (about 8 hour). See you!
👍: 0 ⏩: 1
ok! thanks you so much! i will ^^
👍: 0 ⏩: 1
O:... I'm here, but there is no image. It's averything ok? ^^
👍: 0 ⏩: 1
im going to try with other site :3
👍: 0 ⏩: 0
*raises hand* I'm still having a bit of trouble getting it in my journal...
👍: 0 ⏩: 1
I'm just struggling with what to copy/paste
👍: 0 ⏩: 1
Can you be more specific? n .nU
👍: 0 ⏩: 1
I try to copy all of it, except for the bulleted.
👍: 0 ⏩: 1
what do you mean with "al of it"? oO That's importat to figured out what's happening here.
👍: 0 ⏩: 1
Um...
This is frustrating XD
I tried to copy/paste the information you put up into my journal CSS and it didn't work too well.
👍: 0 ⏩: 1
There are many reason for it's fail. Can you show me your code or an screenshot of you journal-fail?
👍: 0 ⏩: 0
I am using it in my journal!
although, the pink kinda clashes with the zombies, but oh well, i like the pink!
👍: 0 ⏩: 1
What about a dark green? replace all "#d3539b" with "#32402c" and that's all!
👍: 0 ⏩: 1
i have a question.
is it possible to put an image in the background, rather than just a color?
thanks (:
👍: 0 ⏩: 1
Hi,i need your help..I'm made contest and i want to put all donations(prizes) on scroll box but i don't know how..i can send you my css and you can put just in right place if you want please...my journal is t much big and i don't have where to put new prizes and some examples.
👍: 0 ⏩: 1
yes, no problem. Send me by note your css code, please 
👍: 0 ⏩: 2
Did you get note with css..?
👍: 0 ⏩: 1
Yep, i'm working on... but I just go out for lunch (I'm in my work). Wait a minute.
👍: 0 ⏩: 1
Thank you so much dear..
👍: 0 ⏩: 0
Is there a way to change the scroll bar's color?
👍: 0 ⏩: 1
Nope! that is macintosh's scrollbar looks like
👍: 0 ⏩: 1
ahh man... I know that! But I was just wondering if it was possible!
But thanks anyways!
👍: 0 ⏩: 1
well, that's possible using css code, indeed. But I dunno if DA allows that propertie.
👍: 0 ⏩: 1
yeah i dont know either
👍: 0 ⏩: 0
| Next =>