aND|e Posted December 1, 2005 Share Posted December 1, 2005 hi! I'm just new to creating webpages and I've been using the internet and some books for reference. But I can't seem to find how to havea split background. by split, what I mean is, for example i want the left side of the page to be black and the other half to be pink. is this possible? I really appreciate your help! Link to comment Share on other sites More sharing options...
Ikari Posted December 1, 2005 Share Posted December 1, 2005 hi! I'm just new to creating webpages and I've been using the internet and some books for reference. But I can't seem to find how to havea split background. by split, what I mean is, for example i want the left side of the page to be black and the other half to be pink. is this possible? I really appreciate your help! <{POST_SNAPBACK}> make a two new div layers with "z-index: -10" and "width: 50%" other is floating left and other is floating right. Then just put the right background colors. I thik it would work. Link to comment Share on other sites More sharing options...
mani_ Posted December 3, 2005 Share Posted December 3, 2005 Here is the code. <html><head><style type="text/css">.left{position:relative;float:left;z-index:-10;width:50%;height:600px;background-color:black;}.right{position:relative;float:right;z-index:-10;width:50%;height:600px;background-color:pink;}</style><body><div><div class="left"> </div><div class="right"></div></div></body></html> Put the left contents in left div and the right contents in right div. Link to comment Share on other sites More sharing options...
aND|e Posted December 4, 2005 Author Share Posted December 4, 2005 Here is the code.<html><head><style type="text/css">.left{position:relative;float:left;z-index:-10;width:50%;height:600px;background-color:black;}.right{position:relative;float:right;z-index:-10;width:50%;height:600px;background-color:pink;}</style><body><div><div class="left"> </div><div class="right"></div></div></body></html> Put the left contents in left div and the right contents in right div. <{POST_SNAPBACK}> thanks mani_!!! Link to comment Share on other sites More sharing options...
aND|e Posted December 4, 2005 Author Share Posted December 4, 2005 i just tried the code and i was wondering if i can make the height 100% and have no white borders around. is there any code to stick the div to the corners of the page? thanks! Link to comment Share on other sites More sharing options...
mani_ Posted December 4, 2005 Share Posted December 4, 2005 add the body margin:0 in stylesheet. Link to comment Share on other sites More sharing options...
aND|e Posted December 4, 2005 Author Share Posted December 4, 2005 add the body margin:0 in stylesheet.<{POST_SNAPBACK}> hmm..ok..ill try to find the code for that one and give it a try Link to comment Share on other sites More sharing options...
aND|e Posted December 4, 2005 Author Share Posted December 4, 2005 add the body margin:0 in stylesheet.<{POST_SNAPBACK}> hi again mani_!i tried searching for body margin but all i can find are the margins for paragraph. ill try searching some more but if you happen to have the code i'd really appreciate it thanks again so much!Jonas gave me this html code and i want it to appear like this but the code you gave me will make it so much easier because of the div left and right. hope you can help me again <html><head><title>Untitled</title><style type="text/css"><!--body {background-color: pink;}div#left {width: 50%; /* will make the div half the total width of your page. */height: 100%;position: absolute;top: 0px;left: 0px; /* sticks your div in the top-left corner of your page. */background-color: black;}--></style></head><body><div id="left"><font color="#2B60DE"> Menu content, or whatever you want...</div></body></html> Link to comment Share on other sites More sharing options...
inChaos Posted February 16, 2006 Share Posted February 16, 2006 hi again mani_!i tried searching for body margin but all i can find are the margins for paragraph. ill try searching some more but if you happen to have the code i'd really appreciate it thanks again so much!Jonas gave me this html code and i want it to appear like this but the code you gave me will make it so much easier because of the div left and right. hope you can help me again <html><head><title>Untitled</title><style type="text/css"><!--body {background-color: pink;}div#left {width: 50%; /* will make the div half the total width of your page. */height: 100%;position: absolute;top: 0px;left: 0px; /* sticks your div in the top-left corner of your page. */background-color: black;}--></style></head><body><div id="left"><font color="#2B60DE"> Menu content, or whatever you want...</div></body></html><{POST_SNAPBACK}> this works if you have:<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">(or the default doctype...) but this is HTNLbut if doctype is:<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">wich is XHTML...then there is no 100% of height...the same for tables or any tag - az i see...Is XHTML can support height:100% at all?as much as i can see - no... anyone? Link to comment Share on other sites More sharing options...
boen_robot Posted February 16, 2006 Share Posted February 16, 2006 click me Link to comment Share on other sites More sharing options...
Recommended Posts
Create an account or sign in to comment
You need to be a member in order to leave a comment
Create an account
Sign up for a new account in our community. It's easy!
Register a new accountSign in
Already have an account? Sign in here.
Sign In Now