(Untitled)

[sternentochter]

blabla, html question. (yes, whenever an exam is getting nearer i just have to play around with my layout). with the generator layout, is there any universal way to make the content table, you know with your entries and stuff, exactly as wide as the header picture, always, no matter which browser or screen resolution or whatever it is viewed in?

Comments

[isilwen]

You probably have something like this in your overrides box or style, right?

body {
margin-top: 200px !important;
background-image: url(http://pics.livejournal.com/isilwen/pic/000kp9dw) !important;
background-repeat: no-repeat !important;
background-attachment: scroll !important;
background-position: 50% 30px !important;
}
/* change these numbers, must add up to 100%*/
table {
width: 700px;
margin-left: *;
margin-right: *;
}

/* the width value used here should be the same as the width value you've used above, minus the amount you want the entries indented (in this example, 5%), the margin-left and margin-right values MUST be the SAME as above.*/
div table {
width: 700px;
margin-left: *;
margin-right: *;
}

/* do NOT change these numbers */
table table {
width: 100%;
margin:0;
}
table table table {
width: auto;
}

This is the override text of ringcon, and I chose it because it's a similar layout structure as your journal. The tricky parts are those that I bolded: the background-position 50% centers your background picture, no matter what happens, and the width: 700px is where you have to enter the width of your top picture, then the journal content will stay the same width, too. If you enter a * for margin-left and margin-right, that's a "wildcard", telling the browser to display half of the empty space on the left, the other half on the right side of the journal content, so it's centered.

I hope I got all of this right, if it doesn't work for some reason, let me know ;)

[sternentochter]

ah, that's interesting. i think that worked, THANK YOU! you are a genious. :D it produced other problems though (probably because i deleted things i shouldn't have deleted) but i got it all right now. my override box is a mess. html (and css and whatever) is not for me.

[isilwen]

Hehe. Yeah, I know it's a complicated mess... by now, when I see html, I have a pretty good idea what does what, but when there's an error, it's soo difficult to find... :/

For example, I think at the moment your margin-top is not existant, because the tables start up there, not under your picture ;)

[isilwen]

Oh, heh! Now that is funny.

In IE, your layout looks like - I think - you want it to look. But in firefox, it looks totally different. O_o

[sternentochter]

argh oh. i'm incapable of making it look good in every browser. :( i think i deleted that margin-top thing, yes, because i didn't get it to work properly. where would i need to include it? i have some thing called top-padding behing a div{ thing, you know? which i think makes the table start further down, at least in ie. oh my. this layout is so simple and not very different from the one i had before, nevertheless it gives me a headache. maybe i should use a default one.

[isilwen]

Oh, uhm, I think actually I might've included a mistake. Try this, it has to go between < style > and < / style >, within the GLOBAL_HEAD block. I changed the numbers so they should fit for your pic, and the url too. Just to be on the safe side, copy all the overrides you had before from out of your overrides box and save then as a textfile or something, so you can restore them if something goes wrong ;)

/* change these numbers, must add up to 95% or less*/
table {
width: 450px;
margin-left: *;
margin-right: *;
}
/* do NOT change these numbers */
table table {
width: 100%;
}
table table table {
width: auto;
}

body {
margin-top: 348px !important;
background-image: url(http://img.photobucket.com/albums/v295/sternentochter/gras.jpg) !important;
background-repeat: no-repeat !important;
background-attachment: scroll !important;
background-position: 50% 5px !important;
}

[sternentochter]

okay, i did this. so how does it look in your browser? it looks fine in mine (oh look, a rhyme)!

[isilwen]

Ha! Perfect, I think! :) It looks the same in IE and Firefox now. I love the pic, btw! :)

[sternentochter]

:D you are my favourite person on this world! if you were here right now, i would make you waffles with vanilla ice-cream, cherries and cream. (a little bit because that's what i crave right now myself.) and i once found the photo on foundphotos. someone found the picture of the grass lying in the grass just like that :)

[isilwen]

you are my favourite person on this world! if you were here right now, i would make you waffles with vanilla ice-cream, cherries and cream.
:D That is soooo sweet of you! *giggles*

A picture of grass lying on the grass is a cool thing to find. :)