nidhikandan Posted October 12, 2007 Share Posted October 12, 2007 Hi,help me........How is create horizontal DIV with use in CSS, im create one but second div just problem., thats div in not put into text.<!--#container { width:80%; border:1px solid #FF9900; float:left;}#navone { width:33%; float:left; position:relative; background-color:#FF6633; }#navthree { width:33%; float:right; position:relative; background-color:#FFCC33; }#navtwo { width:33%; float:right; position:relative; background-color:#FFFF99; }--></style></head><body><div id="container"> <div id="navone">Left</div> <div id="navtwo">Right</div> <dvi id="navthree">centre</div></div></body></html> Link to comment Share on other sites More sharing options...
Synook Posted October 12, 2007 Share Posted October 12, 2007 thats div in not put into text.What do you mean? I don't quite understand your problem. Link to comment Share on other sites More sharing options...
nidhikandan Posted October 12, 2007 Author Share Posted October 12, 2007 What do you mean? I don't quite understand your problem.Horizontal alignment in CSS, i make it one, thats correct see in browser ,but i can't not put it text in navthree (in Dreamweaver)..pls see..pls open this file in Dreamweaver.<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html xmlns="http://www.w3.org/1999/xhtml"><head><meta http-equiv="Content-Type" content="text/html; charset=utf-8" /><title>Untitled Document</title><style type="text/css"><!--#container { width:80%; height:20px; border:1px solid #FF9900; float:left; margin: 15px 0 15px 10px;}#navone { width:34%; float:left; position:relative; background-color:#FF6633; }#navthree { width:33%; float:right; position:relative; background-color:#FFCC33; }#navtwo { width:33%; float:right; position:relative; background-color:#FFFF99; }--></style></head><body><div id="container"> <div id="navone">Left</div> <div id="navtwo">Right</div> <dvi id="navthree">centre</div></div></body></html> Link to comment Share on other sites More sharing options...
Jerry62704 Posted October 12, 2007 Share Posted October 12, 2007 I can see navone being on the left edge, but wouldn't navthree be on the right edge due to it being the first "right" object? Navtwo would be in the center as it is to the right of the right object. Any reason not to make them all float left and stack them one, two, three?You might want to change the widths - try making them all 20% to fit in the 80% container with all that margins. Just a suggestion.HTH Link to comment Share on other sites More sharing options...
jlhaslip Posted October 13, 2007 Share Posted October 13, 2007 #container { width:80%; height:20px; border:1px solid #FF9900;margin: 0 auto; }#navone { width:33%; float:left; background-color:#FF6633; }#navthree { width:33%;background-color:#FFCC33; }#navtwo { width:33%; float:right; background-color:#FFFF99; } Try that. The navthree should fill the available space in the middle.Your sequencing is good. The first item to the left, the second will go right and the third should fill between them. http://mlafever.jlhaslip.trap17.com/index.html check the turtle images at the top. Link to comment Share on other sites More sharing options...
Recommended Posts
Archived
This topic is now archived and is closed to further replies.