pythontkinterprojectcustomtkintertkinter-layout

'border_color' custom tkinter not working properly?


I am using border_color on a custom tkinter frame and it is not working properly. Here is a picture of how it looks:

Image of the problem

I want the border colour to be around the whole frame but it is not doing so.

Here is my code:

        #this function displays message
        def message(self):
            #function displays important message to user
            self.message_frame = ctk.CTkFrame(self.parent.functions_frame, border_width=3, border_color="white")
            self.message_frame.place(relx=0.7, rely=0.05)

            self.message_title = ctk.CTkLabel(
                self.message_frame,
                text="Important:",
                font=ctk.CTkFont(size=17, weight="bold")
            )
            self.message_title.grid(row=0,column=0)

            self.messages = ctk.CTkLabel(self.message_frame, text="""*Where you can enter a mark you can also update a
mark for the same student by entering a different one""", text_color="red")
            self.messages.grid(row=1,column=0)

Solution

  • You didn't add padding between the edge of the ctk.Frame to the ctk.Labels inside it, so the labels are on the border. You can add padding using padx and pady for your widgets inside the frame.

    Here is an example:

    def message():
        #function displays important message to user
        message_frame = ctk.CTkFrame(root, border_width=3, border_color="white")
        padding = 4 # you can change it as you like
        message_frame.place(relx=0.07, rely=0.05)
    
        message_title = ctk.CTkLabel(
            message_frame,
            text="Important:",
            font=ctk.CTkFont(size=17, weight="bold")
        )
        message_title.grid(row=0,column=0, pady=padding)
    
        messages = ctk.CTkLabel(message_frame, text="""*Where you can enter a mark you can also update a
    mark for the same student by entering a different one""", text_color="red")
        messages.grid(row=1,column=0, pady=padding, padx=padding)
    

    Result:

    enter image description here