| The new Layout Request and Help thread (READ RULES) |
|
Forum Index - Hobbies - Computers & Technology - The new Layout Request and Help thread (READ RULES) |
|
|
|
|
| Posted on 2012-03-24 08:19:42 PM |
Link |
|
Bad syntax. It should look more like this: (but without the line breaks)
Code<div style="background: url('http://www.wallchan.com/images/sandbox/26384-
majora-mask-skull-kid-legend-of-zelda-video-game-games-gaming.jpg') right
no-repeat #000000; color: #440000; border: 7px #650000 inset; padding: 20px;
padding-right: 0px;"><div style="background: url(''); border: 20px #220000
inset; padding 3px; margin right: 450px;">
</div></div>
Also note that the text needs to be brighter.
|
|
| Posted on 2012-03-28 03:16:38 AM |
Link |
|
I'm no computer programming wiz, so it's a miracle I have a layout at all. My current layout header is like THIS. Basically the same image as below but just with a black background. My question is, how do I make a gradient behind everything, like the black to orange?
(I disabled my layout on this post so the picture is easier to separate. Also I just edited this picture for a visual example, code never created that layout... Otherwise I wouldn't be asking.)
|
|
| Posted on 2012-03-28 07:51:35 AM |
Link |
|
You either put an image, which logically won't stretch with the screen resolution, thus may end up looking weird on certain resolutions, or you use a CSS gradient, which I'd recommend.
I don't use any gradient generators, I always type it out by hand, so I'm not sure how good these are, but you should be able to get what you want if you fiddle around with this for a little while.
You can basically remove all unnecessary colour-stops in that thing.
Also I recommend picking a slightly darker orange for the very left side, that'll look a little better.
|
|
| Posted on 2012-03-28 01:38:36 PM |
Link |
|
|
Alright I got the gradient in the background, however now the turret won't show up on the right hand side. Maybe it's being over written in the code? It's probably a very simple fix, but after a few revisions I just can't seem to run the code where I see both the turret, and the gradient. Here's the gradient layout which I currently have.
|
|
| Posted on 2012-03-28 04:37:50 PM |
Link |
|
You should untick the "Comments" checkbox, it just creates a bunch of unneeded bytes, that you won't ever need anyway.
To solve your problem, just use this code:
Header<style type="text/css">.turregrad {
color: #EAEAEA;
font: 14px Tahoma, Sans-Serif;
background: #931100;
background: -moz-linear-gradient(left, #931100 0%, #000000 75%);
background: -webkit-gradient(linear, left top, right top, color-stop(0%,#931100), color-stop(75%,#000000));
background: -webkit-linear-gradient(left, #931100 0%,#000000 75%);
background: -o-linear-gradient(left, #931100 0%,#000000 75%);
background: -ms-linear-gradient(left, #931100 0%,#000000 75%);
background: linear-gradient(left, #931100 0%,#000000 75%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#931100', endColorstr='#000000',GradientType=1 );
}
.turreturre {
background: url('http://img534.imageshack.us/img534/562/284pxportal2turretstand.png') right center no-repeat;
padding: 20px; padding-right: 143px;
}
.turrebox {
background: url('http://img69.imageshack.us/img69/5003/d00e83damnstraightson.png') center #2C3337;
border: 6px outset #F00;
padding: 9px;
min-height: 200px; height: auto !important; height: 200px;
}
</style><div class="turregrad"><div class="turreturre"><div class="turrebox">
Footer</div></div></div>
I just cleaned it up a little, the only problem you had was that the gradient counts as a background on its own, so putting a background-image in the same <div> doesn't work.
By the way, a thick border around a layout looks kind of odd, so I left it out here, if you want it back, just put border: 2px solid #F00; into the .turregrad selector.
Also please do me a favour and disable your header separator in "Edit Profile"
|
|
| Posted on 2012-03-28 04:49:36 PM |
Link |
|
|
Much better. I appreciate the help!
|
|
| Posted on 2012-04-03 06:16:36 AM |
Link |
|
Does anybody want this layout?
It comes complete with four CSS files, four variations of Rex, red, blue, yellow and green.
Originally posted by no-oneThis is the quote box!
CodeI'm not sure about this one though :S
This leads to nothing!
So, do you want it? Signiture Box
Insert stuff here. |
| Last edited on 2012-04-03 06:18:59 AM by Tahixham. |
|
| Posted on 2012-04-03 06:33:04 AM |
Link |
|
|
If you can replace the text with Majoras Mask and find a corresponding MM character picture to go with each color....yes.
|
|
| Posted on 2012-04-03 06:57:56 AM |
Link |
|
It's a Rex layout, not a Zelda layout :/
If you take the layout, you can change it yourself my all means.
|
| Last edited on 2012-04-03 07:05:02 AM by Tahixham. |
|
| Posted on 2012-04-05 11:22:54 AM |
Link |
|
Can anyone make a simp[le layout based on this?
|
|
| Posted on 2012-04-05 12:28:07 PM |
Link |
|
Originally posted by Luigi370Can anyone make a simple layout based on this?
*image*
You are a terrible person for not even caring to look for the source of that image (and for using 9gag, but mainly for not actually caring to look for the original image).
Anyways, I'm uncertain if I'm gonna make this layout or not, but if anyone else feels like doing this layout, use the original image: here (source).
|
|
| Posted on 2012-04-17 07:00:18 PM |
Link |
|
So, I was making an Adventure Time layout! yay I can make layouts
I hope this is looking a-ok, but there's a problem. How can I make that damnit logo have "priority" for the post area? As the Pocket Monsters title on moltensnow's one. And yeah, I'll put this in CSS when done.
That's all right now. When I get more time, I'll learn PHP and put more stuff in it by myself.
E: removed HTML unnecessary stuff.
|
| Last edited on 2012-04-18 01:33:56 PM by Koopster. |
|
| Posted on 2012-04-17 09:41:18 PM |
Link |
|
The easiest way would be to put the <div> containing the logo after the ones that it needs to be on top of.
I hope that made sense :3
|
|
| Posted on 2012-04-18 11:58:26 AM |
Link |
|
|
Thanks, it worked!
|
|
| Posted on 2012-04-18 12:01:06 PM |
Link |
|
That's a horrible idea because then it would be inside the post box.
What you basically need to do since SMWC is a little bit weird about using z-index, is give your main div (the first one, in your case <div style="background: white">) the attribute position: relative; and then give the div containing the logo you want to put in front (in your case the third one) the attribute position: absolute;.
This will put it in front of the post box, but also put it in the top left corner of your layout, so move it around with the top, bottom, right and left attributes.
So if you want the logo to be 10 pixels away from the top border of your post and 20 pixels from the right, you'd put top: 10px; right: 20px;.
Close the div with the logo right after you open it, and give it appropriate height and width attributes fitting the logo.
However you can actually completely ignore this post because your layout code is.. really suboptimal, so I decided to just recode it:
Header<style type="text/css">@import url('http://dl.dropbox.com/u/9054912/Other%20layouts/Adventure%20Time/layout.css');</style><div class="advwhi advrel"><div class="advlog"></div><div class="advfinn"></div><div class="advpad"><div class="advbox advpos">
Footer</div><div class="advbox advsig">Signature yo</div></div></div>
If something bugs you about it, feel free to yell at me, I just tried to make it look a little neater while staying relatively close to the original.
Link here. Signature yo |
|
| Posted on 2012-04-18 01:57:07 PM |
Link |
|
Aww... I just had my CSS file done, but, leod your one is awesome, I'll take that. I recognise, that one was very crappy-coded, I'm a starter in programming HTML/CSS :V
Thank you very much!
|
|
| Posted on 2012-04-18 02:21:06 PM |
Link |
|
Please Guys, i need a Layout with Desing of the Layout of Adventure time, the difference is, with Background of blocks of SMB3 and a PNG of Raccoon Mario in the Right.
Backgorund Here.
Raccoon Mario.
|
| Last edited on 2012-04-18 03:06:50 PM by Felipe Silva. |
|
| Posted on 2012-04-18 07:28:32 PM |
Link |
|
Originally posted by leodWhat you basically need to do since SMWC is a little bit weird about using z-index...
z-index actually works fine. I've used it in a layout before (this one to be exact).
Though I admit I initially had trouble getting it to work >_>
|
|
| Posted on 2012-04-18 07:49:09 PM |
Link |
|
Felipe, here is it! Hope it's not looking that crap. If you want it quote the post and get the code.
If you take it, I'll apreciate if you give credit ^^
E: layout deprecated already.
|
| Last edited on 2012-05-20 02:49:58 PM by Koopster. |
|
| Posted on 2012-04-19 07:17:46 AM |
Link |
|
|
Is a Amazing Layout, thanks BMO !
|
|
|
|
|
|
|
Forum Index - Hobbies - Computers & Technology - The new Layout Request and Help thread (READ RULES) |
