homepage Welcome to WebmasterWorld Guest from
register, free tools, login, search, pro membership, help, library, announcements, recent posts, open posts,
Pubcon Gold Sponsor 2015!
Home / Forums Index / Code, Content, and Presentation / CSS
Forum Library, Charter, Moderators: not2easy

CSS Forum

Scroll content right padding in IE7
Right Padding Inside scroll not showing

5+ Year Member

Msg#: 4104089 posted 9:49 pm on Mar 24, 2010 (gmt 0)

I have a table inside a scroll div and the table does not take any margin-right or padding, it stays flush to the right of the scroll box. I also have a div with a background color and that stays flush to the right. Any help would be appreciated.

Here's the code
(My very first post ever! )

<!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">
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Untitled Document</title>
<style type="text/css">

.note {float: left; background-color: #e9f0f3; width: 100%; padding: 5px; margin-right: 10px;}
.body-scrollpadding {padding: 5px;}

.body-scrollfullscreen {height: auto; min-height: 100px; max-width: 816px; width:816px; border: 1px solid #999999; height: 380px; overflow-y: scroll; overflow-x: hidden; margin: 0px 40px 0px 40px;}

table.data-style1 {width: 98.5%;}
.data-style1 {float: left; color: #424345; border: 1px solid #c2c2c2; margin: 0px 0px 20px 0px; *margin-right: 25px; _width: 98.5%; width: 100%; margin-right: 10px;}
.data-style1 caption {text-align: left; padding-left: 4px; font-weight: bold; padding-bottom: 15px;}
.data-style1 caption span {color: #11b5ce; font-weight: normal;}
.data-style1 td, .data-style1 th {padding: 3px;}
.data-style1 tr th {font-weight: bold; text-align: left; color: #ffffff; border-bottom: 1px solid #c2c2c2;}
.data-style1 tr td{border-bottom:1px dotted #c2c2c2;}
.data-style1 th {background-color: #11b5ce;}
.data-style1 tr.last td {border-bottom: none;}
.data-style1 .even {background:#f2f7f9;}
.checkbox {width: 20px; border: none;}
.subj {font-weight: bold;}
.col-1 {width: 40px; padding: 5px 0px 5px 5px;}
.col-2 {width: 155px; padding: 5px 0px 5px 5px;}
.col-3 {width: 155px; padding: 5px 0px 5px 5px;}
.col-4 {width: 150px; padding: 5px 0px 5px 5px;}
.col-5 {width: 145x; padding: 5px 0px 5px 5px;}
.col-6 {width: 110px; padding: 5px 0px 5px 5px;}




<div class="body-scrollfullscreen">
<div class="body-scrollpadding">
<div class="linespace"></div>
<div class="note"><p>example text</a></p></div>

<div class="linespace"></div>

<h2 class="float-left">Registered</h2>
<div class="float-right"><a class="primary" href="#" onclick="this.blur();"><span>Add User</span></a></div>

<table class="data-style1" cellspacing="0">

<th scope="col" class="col-1">&nbsp;</th>
<th scope="col" class="col-2">First Name</th>
<th scope="col" class="col-3">Last Name</th>
<th scope="col" class="col-4">Email</th>
<th scope="col" class="col-5">Type</th>
<th scope="col" class="col-6">Active?</th>
<td><a href="#" class="icon-edit" title="Click to Edit"><span class="hide">Edit</span>&nbsp;</a></td>
<td><input class="checkbox" type="checkbox" /></td>


</div><!--end body-->


[edited by: limbo at 1:32 am (utc) on Mar 25, 2010]



5+ Year Member

Msg#: 4104089 posted 3:55 pm on Apr 16, 2010 (gmt 0)

try wrapping the whole thing into another div where you can set the margin or padding properties according to your needs.

make sure that the width of the wrapping div is the same or more than the sum of the divs and tables inside.

Global Options:
 top home search open messages active posts  

Home / Forums Index / Code, Content, and Presentation / CSS
rss feed

All trademarks and copyrights held by respective owners. Member comments are owned by the poster.
Home ¦ Free Tools ¦ Terms of Service ¦ Privacy Policy ¦ Report Problem ¦ About ¦ Library ¦ Newsletter
WebmasterWorld is a Developer Shed Community owned by Jim Boykin.
© Webmaster World 1996-2014 all rights reserved