Programming Help

Web Development



What's Here?

  • Members: 107,639
  • Replies: 409,479
  • Topics: 62,190
  • Snippets: 2,253
  • Tutorials: 601
  • Total Online: 970
  • Members: 31
  • Guests: 939

Who's Online?

Welcome to Dream.In.Code
Getting Help is Easy!

Join 107,639 Programmers for FREE! Ask your question and get quick answers from experts. There are 970 online right now! We've got more than 500 tutorials and 2,000 snippets. Join and find out why Dream.In.Code is the #1 programming help community on the internet! Registration is fast and FREE... Join Now!



Div question

 
 Closed TopicStart new topic

Div question, Div positioning
MsAne
post 13 Jun, 2008 - 11:27 AM
Post #1


New D.I.C Head

*
Joined: 14 Feb, 2008
Posts: 18


My Contributions
Ok i have a div called calendar and rss whenever the content div expand it causes the calendar and rss Div's to go down i got like 3hrs troubleshooting, cant find the solution please help this is really frustrating.

P.S. Please feel free to constructive criticize my work im a beginner with CSS any comment to better my work will gladly be appreciated

Here is the CSS
CODE

/*Body*/
body {background: black url('images/background.jpg');
background-repeat: repeat-x;
}

/*-------------------------------Page-------------------------------*/
#page{margin:1em 3em;
padding: 0em 2.5em 0em 2.5em;
background: #898989;
width: 67em;
}

/*-------------------------------Header-------------------------------*/
#header {margin: 0;
height: 200px;
width: 100%;
background: black;
border: solid 2px gray;
}

/*-------------------------------Content-------------------------------*/
#content {margin: 4em 0em 0em 13.5em;
background: #d7d7d7;
width: 37em;
border: solid 1px silver;
padding: 4px;
}
/*-------------------------------Sidebar left--------------------------------*/
img {border:none;
}

#sidebar {margin: 4em 0em 6em 0em;
width: 10em;
background: #555555;
float: left;
padding: 0em;
clear:both;
}

#sidebar ul {margin: 0;

padding:0;

list-style: none;
line-height: 2em;
}



#sidebar li {background: transparent;

display: block;
font-size: 10pt;
border-bottom: solid 1px #707070;
}



#sidebar li ul {padding: 0px;

}



#sidebar li li {

}



#sidebar h6 {margin:0;
    color: #ececec;

    background: #252525;

    font-size: 11pt;
    text-align: center;

}



#sidebar p {
    color: white;

    padding: 20px;

}


#sidebar a:link{
color: lime;
text-decoration: underline;
}        
#sidebar a:active{
text-decoration: none;

color: lime;

}



#sidebar a:hover {
color: red;    

text-decoration: underline;

}

#sidebar a:visited{
text-decoration: none;
color: lime;
}

/*-------------------------------Calendar-------------------------------*/


#calendar {margin:-500px 0 0 0;

    width: 12em;

    background: #E8E8E8;

    color: white;
    float: right;
    

    }




#calendar h2 {

    margin:0;

    font-size: 1.2em;
    text-align: center;
    background: #555555;

}



#calendar p {
    color: white;

    padding: 20px;

}


#calendar a:active{

    color: #blue;

}



#calendar a:hover {

    color: #00aeed;

    border: 1px dashed black;

}

/*-------------------------------rss-----------------------------*/
#rss {
    margin: -400px 0 0 0;

    width: 12em;

    background: #E8E8E8;    
    color: white;
    float: right;
    clear: both;
    }




#rss h2 {

    margin:0;

    background: #555555;

    font-size: 1.2em;
    text-align: center;

}



#rss p {
    color: white;

    padding: 20px;

}


#rss a:active{

    color: blue;

}



#rss a:hover {

    color: #00aeed;

    border: 1px dashed black;

}

/*-------------------------------Footer-------------------------------*/
#footer {
height: 100px;
width: 100%;
background: #ef9c00;
font: red;
clear: both;

border: solid 3px #;
padding: 0px 0px 0px 0px;
}

#footer p {line-height: normal;

font-size: 9px;

text-transform: uppercase;

text-align: center;

color: white;    
}


here is the html

CODE


<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/xhtml1-loose.dtd">
<html xmlns="http://www.w3c.org/1999/xhtml">
<head>
<link rel="stylesheet" type="text/css" href="style2.css" />
<title>Homepage</title>
</head>
<div id="page">

    <div id="header"></div><!--closes header div-->
        <div id="sidebar">

            <h6>Sitemap</h6>    
                <ul>

                

                    <li><a href="#"><img src="images/offk.gif"/>Home</a></li>

                    <li><a href="#"><img src="images/offk.gif"/>Blog</a></li>

                    <li><a href="#"><img src="images/offk.gif"/>Photos</a></li>

                    <li><a href="#"><img src="images/offk.gif"/>About</a></li>

                    <li><a href="#"><img src="images/offk.gif"/>Links</a></li>

                    <li><a href="#"><img src="images/offk.gif"/>Contact</a></li>

                
                </ul>    
            <h6>Bock2</h6>    
                <ul>
                
                    <li><a href="#"><img src="images/offk.gif"/>Undecided</a></li>

                    <li><a href="#"><img src="images/offk.gif"/>Undecided</a></li>

                    <li><a href="#"><img src="images/offk.gif"/>Undecided</a></li>
                
                </ul>
                
            <h6>Block3</h6>
                
                <ul>
                
                <li><a href="#"><img src="images/offk.gif"/>Undecided</a></li>

                    <li><a href="#"><img src="images/offk.gif"/>Undecided</a></li>

                    <li><a href="#"><img src="images/offk.gif"/>Undecided</a></li>
                    
                </ul>
        </div><!--closes sidebar div-->
        
    <div id="content">blah blah blahblah blahblahblahvblah blah blah blah blahblahblahblahblah v blah blah blah
blah blah blahblah blahblahblahvblah blah blah blah blahblahblahblahblah v blah blah blah
blah blah blahblah blahblahblahvblah blah blah blah blahblahblahblahblah v blah blah blah
blah blah blahblah blahblahblahvblah blah blah blah blahblahblahblahblah v blah blah blah
blah blah blahblah blahblahblahvblah blah blah blah blahblahblahblahblah v blah blah blah
blah blah blahblah blahblahblahvblah blah blah blah blahblahblahblahblah v blah blah blah
    </div><!--closes primary content div-->

    <div id="content">
            <p>blah blah blahblah blahblahblahvblah blah blah blah blahblahblahblahblah v blah blah blah
blah blah blahblah blahblahblahvblah blah blah blah blahblahblahblahblah v blah blah blah
blah blah blahblah blahblahblahvblah blah blah blah blahblahblahblahblah v blah blah blah
blah blah blahblah blahblahblahvblah blah blah blah blahblahblahblahblah v blah blah blah
blah blah blahblah blahblahblahvblah blah blah blah blahblahblahblahblah v blah blah bla    
blah blah blahblah blahblahblah blah blah blahblah blahblahblahvblah blah blah blah blah
    blahblahblahblah v
            </p>
    </div> <!--closes second content div-->

        <div id="calendar">
                <h2>Calendar</h2>
                <p>test</p>
        </div><!--closes calendar div-->
            
            <br/>
            
                <div id="rss">
                        <h2>RSS FEED</h2>
                        <p>test</p>
                </div><!--closes rss div-->
        
<div id="footer">
<p>test</p>
</div><!--closes footer div-->

</div><!--closes page div-->
</body>
</html>



This post has been edited by MsAne: 13 Jun, 2008 - 11:32 AM
User is offlineProfile CardPM

Go to the top of the page


jjsaw5
post 13 Jun, 2008 - 11:31 AM
Post #2


D.I.C. Face

Group Icon
Joined: 4 Jan, 2008
Posts: 937



Thanked 5 times

Dream Kudos: 125
My Contributions
Your thread title is asking for help.


SO here is a HELPFUL piece of advice.

Please DO NOT use titles like "HELP ME PLEASE" it turns most people away from your thread. Use a more helpful and descriptive title.


I guess no one can read the MASSIVE BRIGHT YELLOWbox that appears before you make any post on the site.



And one more thing DON'T DOUBLE POST!!!

This post has been edited by jjsaw5: 13 Jun, 2008 - 11:31 AM
User is online!Profile CardPM

Go to the top of the page

MsAne
post 13 Jun, 2008 - 11:34 AM
Post #3


New D.I.C Head

*
Joined: 14 Feb, 2008
Posts: 18


My Contributions
QUOTE(jjsaw5 @ 13 Jun, 2008 - 11:31 AM) *

Your thread title is asking for help.


SO here is a HELPFUL piece of advice.

Please DO NOT use titles like "HELP ME PLEASE" it turns most people away from your thread. Use a more helpful and descriptive title.


I guess no one can read the MASSIVE BRIGHT YELLOWbox that appears before you make any post on the site.



And one more thing DON'T DOUBLE POST!!!


I closed the other post because i realized it was in the wrong category and i dont know how to delete it or move it to the correct category, so i did another post here
User is offlineProfile CardPM

Go to the top of the page

MsAne
post 16 Jun, 2008 - 06:05 AM
Post #4


New D.I.C Head

*
Joined: 14 Feb, 2008
Posts: 18


My Contributions
anybody know th problem?
User is offlineProfile CardPM

Go to the top of the page

Closed TopicStart new topic
Time is now: 8/29/08 07:05PM
Invision Power Board v2.1.7 © 2008  IPS, Inc.
Licensed to: MediaGroup1

Live Help!

Tutorials

Programming

Web Development

Reference Sheets

Code Snippets

Bye Bye Ads

Free DIC T-Shirt

T-Shirt Example

Related Sites

Monthly Drawing

Thumb Drive

Partners

Top Contributors

Top 10 Kudos This Month