Centered content with changing background color
in [CSS]
|
From: shapper on 19 Apr 2010 20:44 On Apr 19, 4:59 pm, Johannes Koch <k...(a)w3development.de> wrote: > shapper schrieb: > > > Basically, I want to have a center div with the content. > > > The page background on the left of that div would be red and the page > > background on the right of that div would be black. > > The content div background would be white. Something like: > > > RED CONTENT(White BK) BLACK > > And what do you expect, if the canvas is higher than the content with > white background? I was looking for 100% height. In all three columns. > > -- > Johannes Koch > In te domine speravi; non confundar in aeternum. > (Te Deum, 4th cent.)
From: shapper on 19 Apr 2010 20:46 On Apr 19, 5:01 pm, David Stone <no.em...(a)domain.invalid> wrote: > In article > <36e3ecf5-1841-4405-a58b-90b63402e...(a)s9g2000yqa.googlegroups.com>, shapper <mdmo...(a)gmail.com> wrote: > > [snip] > > > I think I didn't explained myself well or maybe I am understanding > > your explanation. > > > Basically, I want to have a center div with the content. > > > The page background on the left of that div would be red and the page > > background on the right of that div would be black. > > The content div background would be white. Something like: > > > RED CONTENT(White BK) BLACK > > Does this suffice? Obviously, you'd want to do something about > the green background that shows up if the browser window is higher > than the content... > > http://www.chem.utoronto.ca/~dstone/html/split-background.html That seems the Faux Columns approach with the background? I was trying to have 100% height in all three columns. More like Dorayme approach but with with fixed width for middle content. > > It would be nicer if you could stretch background images the way > you can with, say, an <img> - that way, you could avoid having to > make a background image wider than you expect the widest screen > to be. Unfortunately, I don't see that in CSS 2.1 specs. > > Could you achieve the same effect using a small <img> with height > and width set to 100%, layered behind the content using z-index?
From: shapper on 19 Apr 2010 20:46 On Apr 19, 6:40 pm, Ben C <spams...(a)spam.eggs> wrote: > On 2010-04-19, shapper <mdmo...(a)gmail.com> wrote: > > > > > On Apr 19, 11:21 am, Ben C <spams...(a)spam.eggs> wrote: > >> On 2010-04-19, shapper <mdmo...(a)gmail.com> wrote: > > >> > Hello, > > >> > Is it possible to create a page with centered contend where the margin > >> > on the right has a different background color of the margin on the > >> > left? > > >> > Any idea how to accomplish this? > > >> Margins are always transparent, so just give the thing the box is on > >> top of a sort of harlequin background (either fill it with a couple of > >> divs with different colours, or use a vertically repeating image). > > > I think I didn't explained myself well or maybe I am understanding > > your explanation. > > > Basically, I want to have a center div with the content. > > > The page background on the left of that div would be red and the page > > background on the right of that div would be black. > > The content div background would be white. Something like: > > > RED CONTENT(White BK) BLACK > > What colour do you want the page to be above and below the div? Nothing on below or above. I was trying the looks of Dorayme's example.
From: dorayme on 19 Apr 2010 21:50 In article <6a950cb2-0da8-49f9-91e2-d86ac9a944e2(a)w16g2000vbf.googlegroups.co m>, shapper <mdmoura(a)gmail.com> wrote: > Nothing on below or above. I was trying the looks of Dorayme's example. You can call me dorayme now, how long have we known each other. Perhaps your newsreader picks up messages slowly or maybe my service at albasani (which has been playing up lately?) is slow. Anyway, here is one of two URLs I put up previously but I think you can add a bit of CSS to make the content top to bottom when the content has not much in it: <http://dorayme.netweaver.com.au/bicolourMargins.html> (The other one, which I prefer, it is so straightforward is the image background approach: <http://dorayme.netweaver.com.au/bicolourBgStrip.html> ) -- dorayme
From: dorayme on 20 Apr 2010 18:52
In article <slrnhsrlpl.534.spamspam(a)bowser.marioworld>, Ben C <spamspam(a)spam.eggs> wrote: > On 2010-04-20, Joshua Cranmer <Pidgeot18(a)verizon.invalid> wrote: > > On 04/20/2010 05:11 AM, invalidmasonc(a)invalid.invalid wrote: > >> On Tue, 20 Apr 2010 17:44:45 +1000, dorayme<dorayme(a)optusnet.com.au> > >> wrote: > >> > >>> > >>> What greek? > >> > >> Lorem ipsum iisque utroque maiestatis et mea, nec et solum modus > >> copiosae, quo evertitur posidonium intellegebat in. Vis platonem > >> abhorreant no, cu simul virtute sapientem sit. Duo eu erant > >> prodesset persequeris, facer doming gloriatur mel id, ea ius ubique > >> offendit signiferumque. Ea vis dicam tantas labores, has cu congue > >> scripserit. > > > > That's Latin, not Greek. > > It certainly isn't Latin (or Greek). Is this Latin: Arma virumque cano, Troiae qui primus ab oris Italiam, fato profugus, Laviniaque venit litora, multum ille et terris iactatus et alto vi superum saevae memorem Iunonis ob iram; multa quoque et bello passus, dum conderet urbem, inferretque deos Latio, genus unde Latinum, Albanique patres, atque altae moenia Romae. ? I must get rid of the silly 'lorem' text clipping I keep on the desktop to be dragged and dropped when I need ABT text. -- dorayme |