WordPress.org

Ready to get started?Download WordPress

Forums

Problem displaying my website (2 posts)

  1. nickelbert
    Member
    Posted 4 years ago #

    Here is my website http://nickhiebert.com

    Right now it works great on my 1280x800 resolution screen. But the problem is when you zoom in and out with both ctrl + and - the website explodes everything spreads out.
    Please view this in Firefox/Safari/Google Chrome only. IE 6/7/8 and Opera doesn't work yet.

    I don't know why it's not displaying right when I zoom in and out.

  2. nickelbert
    Member
    Posted 4 years ago #

    Style.css

    /* SIDEBAR */
    
    #sidebar {
    	float: left;
    	width: 314px;
    	padding-bottom: 100px;
    	color: #231f20;
    	padding-left: 30px;
    	margin-left: 10px;
    	margin-top: 10px;
    }
    
    #sidebar h3 {
    	color: #bab8b8;
    	font-size: 18px;
    	margin-right: 312px;
    	margin-left: -25px;
    	padding-right: 20px;
    	padding-left: 41px;
    	position: relative;
    }
    
    #searchform {
    	float: left;
    	width: 235px;
    	padding-left: 45px;
    	margin-right: 60px;
    }
    
    #sidebar a {
    	color: #231f20;
    	line-height: 1.5em;
    	position: relative;
    	margin-right: 5px;
    	margin-left: -25px;
    }
    
    #sidebar a:hover {
    	color: #bab8b8;
    }
    
    /* END SIDEBAR */
    
    /* BODY */
    
    html {
    	background: url(http://nickhiebert.com/wp-content/themes/portfolio/images/background.png) scroll;
    }
    
    body {
    	text-align: left;
    	font-size: 100%;
    	font-family: Geneva, Arial, Helvetica, sans-serif;
    	color: #999999;
    	background: url(http://nickhiebert.com/wp-content/themes/portfolio/images/mainBG.png) repeat-y;
    	margin-right: 128.2px;
    	margin-left: 137.2px;
    	margin-bottom: -18px;
    	background-position:center;
    }
    
    body h1 a{
    	float: left;
    	padding-left: 60px;
    	padding-top: 9px;
    	width: 260px;
    }
    
    body h2 a {
    	color:#000000;
    }
    
    a {
    	text-decoration: none;
    }
    
    a:hover {
    	text-decoration: none;
    }
    
    p {
    	color: #333333;
    	line-height: 20px;
    	margin-right: -20px;
    }
    
    h1 {
    	float: left;
    	margin-top: 0;
    	border: none;
    	width: 260px;
    	margin-left: 0;
    }
    
    img {
    	border-style: none;
    	margin-left: -46.5px;
    	float: left;
    	margin-top: -9px;
    }
    
    h2 {
    	font-size: 25px;
    	margin-right: 45px;
    	overflow: hidden;
    }
    
    #container {
    	width: 973px;
    	margin: auto;
    	text-align: left;
    }
    
    /* END BODY */
    
    /* HEADER */
    
    #header h1 a{
    	float: left;
    	margin-right: 312px;
    	width: 260px;
    }
    
    /* END HEADER */
    
    /* NAVIGATION */
    
    #nav {
    	background: url(http://nickhiebert.com/wp-content/themes/portfolio/images/nav_bg.png) repeat-x;
    	overflow: hidden;
    	height: 93px;
    	margin-right: 12.5px;
    	margin-left: -71px;
    	padding: 0 0 0 31px;
    }
    
    #nav li {
    	float: right;
    	line-height: 93px;
    	padding-left: 5px;
    	padding-right: 85px;
    	width: 110px;
    }
    
    #nav li a {
    	padding: 0 1em;
    	color: #565354;
    	text-transform: uppercase;
    	font-size: 17.3px;
    	font-weight: bold;
    	line-height: 20px;
    	font-family: Arial, Helvetica, sans-serif;
    	list-style-type: none;
    }
    
    #nav li a.first {
    	padding-left: 0;
    }
    
    ul, li {
    	list-style-type: none;
    }
    
    /* END NAVIGATION */
    
    /* MAIN CONTENT*/
    
    #content {
    	float: right;
    	width: 500px;
    	padding: 0 10px;
    	margin-right: 110px;
    }
    
    #content .date {
    	padding-left: 0;
    	color: #000000;
    }
    
    #content .post-comments a {
     	color: #999999;
    }
    
    comment form .p {
    	margin-right: -50px;
    }
    
    /* END MAIN CONTENT*/
    
    /* FOOTER*/
    
    #credits {
    	background: url(http://nickhiebert.com/wp-content/themes/portfolio/images/footer_bg.png) repeat-x bottom;
    	clear: both;
    	margin-bottom: 40px;
    	padding-top: 15px;
    	margin-right: 14px;
    	margin-left: 14px;
    	padding-bottom: 20px;
    }
    
    #credits .alignleft {
    	margin-left: 175px;
    	margin-bottom: 10px;
    	margin-top: 10px;
    	padding-top: 10px;
    	padding-bottom: 16px;
    	color: #231F20;
    }
    
    #credits .alignright {
    	color: #231F20;
    }
    #credits a, alignleft, alignright {
    	padding-bottom: 20px;
    }
    
    /* END FOOTER*/

Topic Closed

This topic has been closed to new replies.

About this Topic