CSS - 仍然有边距和填充

时间：2022-11-14 22:50:48

OK so I'm using FancyBox(.net) and I'm trying to make a header without no margin and padding and it's NOT doing it. Here is what I get:

好的，所以我正在使用FancyBox（.net），我正在尝试制作一个没有边距和填充的标题，而且它没有这样做。这是我得到的：

CSS - 仍然有边距和填充

As you can see, there is whitespace near the top and sides of the blue header... and there should not be...

如你所见，蓝色标题的顶部和两侧附近有空白......并且不应该......

Here is what I have so far, thanks:

这是我到目前为止，谢谢：

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
    <meta http-equiv="imagetoolbar" content="no" />
    <title>FancyBox 1.3.4 | Demonstration</title>
    <script type="text/javascript" src="jquery-1.5.1.min.js"></script>
    <script type="text/javascript" src="scripts/fancybox/jquery.mousewheel-3.0.4.pack.js"></script>
    <script type="text/javascript" src="scripts/fancybox/jquery.fancybox-1.3.4.pack.js"></script>
    <link rel="stylesheet" type="text/css" href="scripts/fancybox/jquery.fancybox-1.3.4.css" media="screen" />

    <link rel="stylesheet" href="style.css" />
    <script type="text/javascript">
        $(document).ready(function() {

            $("#various1").fancybox({
        'transitionIn'   :  'fade',
        'transitionOut'  :  'fade',
        'speedIn'        :  300, 
        'height': '300',
        'width': '300',
        'speedOut'       :  300, 
                'opacity'       : true,
                'centerOnScroll': true,
                'autoDimensions': false
            });

        });
    </script>

    <style>
    .header {
background:#789FCC;
color:#fff;
font:16px verdana;
font-weight:700;
padding:5px;
}
    h3 {
        font-weight: bold;
        font-size: 17px;
        display: block;
         padding:0;
        margin:0;        
    }
    #inline1 {
        padding:0;
        margin:0;    
    }    
    </style>

</head>
<body>

    <a id="various1" href="#inline1">Report Answer</a>


           <div style="margin:0;padding:0;display:none;">
        <div id="inline1" style="padding:0;marging-top:10px;">
        <div class="header"><h3>Report this content</h3></div>
Testing...
        </div>  </div>


</body>
</html>

3 个解决方案

#1

1  

write this in iternel CSS

在iternel CSS中写这个

#fancybox-content { border-width:0px!important;text-align:center;}

also make changes in jquery.fancybox-1.3.4.css

也可以在jquery.fancybox-1.3.4.css中进行更改

#fancybox-outer {
   width: 94%;
}

#2

10  

$("#item").fancybox({padding: 0});

#3

0  

iternel CSS

iternel CSS

.fancybox-content {height: 90%!important; max-height: calc(100% - 20px)!important; width:98%!important;max-width: calc(100% - 20px)!important;}

#1

1  

write this in iternel CSS

在iternel CSS中写这个

#fancybox-content { border-width:0px!important;text-align:center;}

also make changes in jquery.fancybox-1.3.4.css

也可以在jquery.fancybox-1.3.4.css中进行更改

#fancybox-outer {
   width: 94%;
}

#2

10  

$("#item").fancybox({padding: 0});

#3

0  

iternel CSS

iternel CSS

.fancybox-content {height: 90%!important; max-height: calc(100% - 20px)!important; width:98%!important;max-width: calc(100% - 20px)!important;}

标签：

相关文章