www.webdeveloper.com
Results 1 to 3 of 3

Thread: Positioning

Hybrid View

  1. #1
    Join Date
    Jun 2011
    Posts
    64

    Question Positioning

    I have the Add This widget on my site and it is in my footer of the page but it is disobeying my CSS margin and padding rules therefore making it sink below the bottom of the footer div. How can I fix this? Screenshot here http://i51.tinypic.com/2cwq2yv.png

    Code:
    <div id="footer">
    <a href="http://www.firstclassphotos.co.uk/"><h1 id="footertxt">FIRST CLASS PHOTOS
    </h1></a>
    <div id="footnavdiv"><!--START NAV-->
    <ul id="footernav">
      <li class="footnav"><a href="http://www.firstclassphotos.co.uk/">Home</a></li>
    <li class="footnav"><a href="http://about.me/thomashochkins">About Me</a></li>
    <li class="footnav"><a href="http://www.firstclassphotos.co.uk/photos.html">Photos</a></li>
    <li class="footnav"><a href="http://www.firstclassphotos.co.uk/download.html">Download</a></li>
    <li class="footnav"><a href="http://www.firstclassphotos.co.uk/videos.html">Videos</a></li>
    <li class="footnav"><a href="http://www.firstclassphotos.co.uk/contact.html">Contact</a></li>
    </ul>
    <!-- AddThis Button BEGIN -->
    <div class="addthis_toolbox addthis_default_style addthis_32x32_style" style="float:right; margin-right:60px;">
    <a class="addthis_button_preferred_1"></a>
    <a class="addthis_button_preferred_2"></a>
    <a class="addthis_button_preferred_3"></a>
    <a class="addthis_button_preferred_4"></a>
    <a class="addthis_button_compact"></a>
    <a class="addthis_counter addthis_bubble_style"></a>
    </div>
    <script type="text/javascript" src="http://s7.addthis.com/js/250/addthis_widget.js#pubid=xa-4e174c6f09feea7f"></script>
    <!-- AddThis Button END -->
    </div><!--END NAV-->
    
    </div><!--END FOOTER-->
    Code:
    #footernav {
    	list-style:none;
    }
    
    .footnav a {
    	list-style:none;
    	font-family:Arial, Helvetica, sans-serif;
    	font-size:12px;
    	margin-left:20px;
    	text-shadow: rgba(0,0,0,0.5) -1px 0, rgba(0,0,0,0.3) 0 -1px, rgba(255,255,255,0.15) 0 0.5px, rgba(0,0,0,0.3) -0px -0px;
    	color:#333;
    	text-decoration:none;
    	letter-spacing:2px;
    }
    
    #footertxt {
    	text-shadow: rgba(0,0,0,0.5) -1px 0, rgba(0,0,0,0.3) 0 -1px, rgba(255,255,255,0.3) 0 0.5px, rgba(0,0,0,0.3) -0px -0px;
    	font-weight:800;
    	color:#333;
    	font-family:Arial, Helvetica, sans-serif;
    	font-size:24px;
    	margin-left:60px;
    	margin-right:auto;
    }
    
    #footer {
    	height:auto;
    	width:800px;
    	background-color:#464646;
    	background-image:url(images/Picture2.png);
    	background-repeat:repeat;
    	-webkit-border-bottom-left-radius:10px;
    	-webkit-border-bottom-right-radius:10px;
    	border-bottom-left-radius:10px;
    	border-bottom-right-radius:10px;
    	-moz-border-bottom-lift-radius:10px;
    	-moz-border-bottom-right-radius:10px;
    	border-top:1px solid #CCC;
    	margin-top:20px;
    	margin-bottom:-20px;
    	padding-bottom:10px;
    }
    
    #footnavdiv {
    	width:800px;
    }

    Thanks
    Thomas

  2. #2
    Join Date
    Jul 2006
    Posts
    207
    margin-top: -50px; on the 'add this' DIV puts it in the footer for me.

  3. #3
    Join Date
    Jun 2011
    Posts
    64

    Thumbs up Thanks

    Thanks a lot it is all sorrted now

    thanks
    Thomas

Thread Information

Users Browsing this Thread

There are currently 1 users browsing this thread. (0 members and 1 guests)

Tags for this Thread

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •  
HTML5 Development Center



Recent Articles