Skip to main content
N
Nopparat27681655svs7
Participant
December 23, 2022
Question

How to remove these white line (Border)

  • December 23, 2022
  • 3 replies
  • 1033 views

 Do you see the white lines under the brown ones? That's my problem. I think it's about border. Can you guys help me? I changed the value of border to 0 already But it still has white lines. If you want to ask more questions, you can tell me.

This topic has been closed for replies.

3 replies

L
Community Expert
L e n aCommunity Expert
Community Expert
December 23, 2022

It really looks like if you are using TABLE... are you ?

    N
    Nopparat27681655svs7Author
    Participant
    December 23, 2022

    yes I am using table But I didn't take a picture. I think it probably came directly from the boarder. But I just might not be able to find it.

    BenPleysier
    Community Expert
    BenPleysierCommunity Expert
    Community Expert
    December 23, 2022

    The answer lies in the code. The best way for us to go through the code is to upload the file to a (temporary) online location.

     

    In the meantime you could add the following style rule at the start of the style sheet.

     

    * {
    padding: 0;
    margin: 0;
    border: 0;
}

     

     

    This may mess up a few other styles, but at least you will have something to work with.

    Wappler is the DMXzone-made Dreamweaver replacement and includes the best of their powerful extensions, as well as much more!
      N
      Nopparat27681655svs7Author
      Participant
      December 23, 2022

      thank you very much i will try it.

      N
      Nopparat27681655svs7Author
      Participant
      December 23, 2022

      when it in Dreamweaver it always fine i don't itttt

      Nancy OShea
      Community Expert
      Nancy OSheaCommunity Expert
      Community Expert
      December 23, 2022

      @Nopparat27681655svs7,

      Unfortunately, this looks like it was exported from Photoshop.  The rigid table structure pulls apart creating unsightly empty spaces (not borders) between image slices. 

       

      I recommend ditching image-based navigation.  It's not user-friendly and it's invisible to screen readers and language translators.  More importantly, you don't need TABLES for any of this.  Tables are for spreadsheets only. See screenshot.

       

       

      Copy & paste this code into a new, blank document.

       

      <!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>Vertical Navigation</title>
<meta name="viewport" content="width=device-width, initial-scale=1">
<style>
body {
margin: 0 auto;
width: 95%;
min-height: 100vh;
display: flex;
flex-direction: column;
background: #F2D2A2
}
nav {
width: 150px;
background: #F3DB56;
border: 10px solid goldenrod;
border-radius: 20px;
}
nav ul {
list-style: none;
padding: 0;
}
nav li a {
display: block;
line-height: 1.5;
font-size: 1.5rem;
text-align: center;
text-decoration: none;
color: #FFF;
text-shadow: 1px -2px 2px #000;
}
nav a:hover, nav a:active, nav a:focus {
color: rgba(0,0,0,1);
text-shadow: none;
text-decoration: underline;
}
.container { display: flex; }
main {
padding: 2%;
width: 70%
}
footer { padding: 2%; }
</style>
</head>

<body>
<div class="container">
<nav>
<ul>
<li><a href="#">Link 1</a></li>
<li><a href="#">Link 2</a></li>
<li><a href="#">Link 3</a></li>
<li><a href="#">Link 4</a></li>
<li><a href="#">Link 5</a></li>
</ul>
</nav>
<main>
<h3>Heading 3</h3>
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Non sit quaerat excepturi rerum ipsum perferendis enim quas aperiam, ratione quasi at quae, fugit maiores dolorem modi esse, ea, nihil nesciunt.</p>
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Non sit quaerat excepturi rerum ipsum perferendis enim quas aperiam, ratione quasi at quae, fugit maiores dolorem modi esse, ea, nihil nesciunt.</p>
</main>
</div>
<footer> Footer goes here... </footer>
</body>
</html>

       

       

      Hope that helps.   Post back if you have any questions.

       

       

       

      Nancy O'Shea— Product User & Community Expert
        Terms & ConditionsAccessibility statement
        Using the community Terms of use Privacy Cookie preferences Do not sell or share my personal information ad choicesAdChoices