| *Advanced HTML/CSS Tutorial & [CSS HELP THREAD] |
|
Forum Index - Hobbies - Computers & Technology - *Advanced HTML/CSS Tutorial & [CSS HELP THREAD] |
|
|
|
|
| Posted on 2011-03-15 09:08:04 AM |
Link | Quote |
|
|
Your problem is the HTML filter. It escapes the >s in your CSS, and no browser accepts that. Load it externally (from e.g. the file bin) instead.
|
|
| Posted on 2011-03-15 09:12:15 AM |
Link | Quote |
|
Does it actually make any difference in loading speed when you link it externally?
Of course, assuming it's hosted in the file bin and not on a whole different site, as I'm fairly sure that'll slow it down quite a bit.
|
|
| Posted on 2011-03-15 01:19:01 PM |
Link | Quote |
|
Yo leod, ever heard of caching? Well, browsers can't cache the layout code, only individual pages.
So most of the time external .css codes are better
|
|
| Posted on 2011-03-15 03:55:04 PM |
Link | Quote |
|
Actually, I do use an external CSS file, but I did internal with the "preview post" function to make the layout at first.
However, upon looking at the source code, even after I've made the post with internal CSS, the ">" character gets parsed into the > entity. However, it still works! What's up with that?
...Now this is really weird. So, when viewing my last post in the thread, the quote box shows up correctly. However, while writing my post, it shows up as an unstyled quote box in the recent posts below. That's some odd stuff. Seems like a CSS issue with the New Reply page?
Okay, I figured out why it was working once it was posted. My other post was enabling it with it's other code. I should have realized that. Anyway, case closed.
|
|
| Posted on 2011-03-27 01:42:22 PM |
Link | Quote |
|
Ok slight dilemma here.
Visit this page. If you are using Firefox, then it should look fine. However, if you're using anything else, you should see that the background image is stuck at the top.
CSS is like this:
Codebody {
background: url('http://ladida.zymichost.com/images/bqbg.png') bottom repeat-x #00F4F8;
font: 1em verdana;
color: white;
height: 100%;
}
Note that when i adjust the height, the background image's bottom will be that far down the page in chrome, opera, safari, ie, etc. In firefox it will go down to the very bottom (the intended behavior). I am utterly confused and wonder which browser renders it correctly, and how to fix it without having a custom height for each page (by fix i mean have it behave as in firefox).
Thanks :>
|
|
| Posted on 2011-03-27 03:43:37 PM |
Link | Quote |
|
Hmm, I've been looking for multiple solutions, and all but one seems to come with a problem. So let's use that one.
First, add this to the css
Then, change your css to this
Codebody {
background: url('http://ladida.zymichost.com/images/bqbg.png') fixed bottom repeat-x #00F4F8;
font: 1em verdana;
color: white;
}
Now, after the sidebar div, you should add
Code<div style="clear: both;"></div>
(btw, you should always add that after using a float element)
This change will make sure the background is at the bottom, even if you're scrolling. (Note that I haven't tested this in FF, but FF should render this simple code correctly.)
|
|
| Posted on 2011-03-27 08:07:04 PM |
Link | Quote |
|
|
Yeah FF renders it alright. Thanks!
|
|
| Posted on 2011-04-09 03:45:05 AM |
Link | Quote |
|
Now, I'd normally just go to the layout request business, but I figured I might as well learn to do this myself. I'm totally new to HTML and CSS.
I skimmed through both Dots' tutorial and this one and still couldn't figure a couple of things out.
1.) Is it possible to have one y-repeat background and a x-repeat one under it?
For example:
Layout BG on top
| Post |
| Signature|
Different BG on bottom
2.) Is it possible to have a half transparent image in your post box?
Thanks...
- SD
|
|
| Posted on 2011-04-09 07:37:29 AM |
Link | Quote |
|
Originally posted by StripeyDope2.) Is it possible to have a half transparent image in your post box?
Look at Zephyr's layout, it does that too if you mean that.
Also I have no idea what you mean with 1.
|
|
| Posted on 2011-04-09 12:26:14 PM |
Link | Quote |
|
For 1, you'd just need two DIV tags for each background. You can also just have them in one DIV tag, seperating them in the CSS with commas, like so:
.bla { background: url(a) top repeat-y, url(b) bottom repeat-x; }
however, this isn't supported in some browsers iirc, so I'd go with the first.
For the second, you'd just set the half-transparent image as the background of the post box's DIV.
|
|
| Posted on 2011-04-09 08:31:16 PM |
Link | Quote |
|
I'm sure all major browsers support css3 so I see no problem in grouping background properties.
Of course, you'd still have to check. Just in case.
|
|
| Posted on 2011-04-14 11:33:44 PM |
Link | Quote |
|
So I have this new layout and stuff but SNN told me that the text was hard to read, so I darked the post BG. I didn't really like the look of the layout, so I reverted and asked other people what they thought and it seemed not many people cared.
Can you guys read the text in my layout without any problems?
If I get enough people telling me it's difficult to read, I'll continue darkening the post BG until it's barely transparent ... unless you guys can suggest a different way.
|
|
| Posted on 2011-04-14 11:42:46 PM |
Link | Quote |
|
|
I can see it pretty good. It's a tiny bit hard to read but I can make out what the post says. Of course, changing your text color to black or a shade of gray would help because most of your backgrounds are white and light blue. White on white doesn't really work well (in this case sky blue), even with text shadow. The alpha definitely helps but I think it should be darker. If you don't like the post box to be gray then consider getting a colored alpha, it would still be the background color but just darker.
|
| Last edited on 2011-04-14 11:44:21 PM by Snowshoe. |
|
| Posted on 2011-04-15 12:45:38 AM |
Link | Quote |
|
|
You can also try making the text shadow a bit larger as well as a bit darker. Though I believe the best solution would be one of Snowshoe's suggestions to change the text color to something darker, though I'm not sure how well that'll fit along with the rest. (nice layout btw :> )
|
|
| Posted on 2011-04-15 02:49:46 AM |
Link | Quote |
|
I got rid of the transparent stuff altogether. I'll change the text to a darker grey soon and see what else I can do.
Quote(nice layout btw :>)
ty :3
|
|
| Posted on 2011-07-21 01:56:59 PM |
Link | Quote |
|
I don't know, but my Layout don't work too well in Chrome or Opera (in IE too, but this browser is way too shitty; and in Opera shows some parts)
What I'm doing wrong?
Here's the .css file.
|
|
| Posted on 2011-07-21 02:35:54 PM |
Link | Quote |
|
|
JowTH, in Opera, it looks fine to me... :\ And in Chrome it don't even appears.
|
|
| Posted on 2012-07-20 12:49:13 PM |
Link | Quote |
|
Wow,it easier than I thought 
But how I can transform my layout's letters from This to This (if it's possible )
|
|
| Posted on 2012-07-20 01:04:50 PM |
Link | Quote |
|
Originally posted by Mrpinci19But how I can transform my layout's letters from This to This
Just add font-weight: bold; to the style of your layout's first div (the one with the background).
However that will make you unable to ever bold anything in your posts and it really doesn't strike me as good looking.
Also please change the .ex2 class you're using, when other people use the same generic class, your layouts will fuck up if you post in the same thread, that's happened often enough in the past.
Just change every instance of .ex2 in your layout to .mrpinci and you should be fine.
|
|
| Posted on 2012-07-20 01:33:36 PM |
Link | Quote |
|
Originally posted by leodOriginally posted by Mrpinci19But how I can transform my layout's letters from This to This
Just add font-weight: bold; to the style of your layout's first div (the one with the background).
However that will make you unable to ever bold anything in your posts and it really doesn't strike me as good looking.
Also please change the .ex2 class you're using, when other people use the same generic class, your layouts will fuck up if you post in the same thread, that's happened often enough in the past.
Just change every instance of .ex2 in your layout to .mrpinci and you should be fine.
Done,i changed every .ex2,and talking about the bold,I better don't use it but thanks anyway
|
|
|
|
|
|
|
Forum Index - Hobbies - Computers & Technology - *Advanced HTML/CSS Tutorial & [CSS HELP THREAD] |