जीडब्ल्यूटी: वृक्ष पंक्तियों का पैडिंग बदलें?

एक GWT पेड़ मोटे तौर पर इस तरह दिखता है:जीडब्ल्यूटी: वृक्ष पंक्तियों का पैडिंग बदलें?

<div class="gwt-Tree"> 
    <div style="padding-top: 3px; padding-right: 3px; 
       padding-bottom: 3px; margin-left: 0px; 
       padding-left: 23px;"> 
     <div style="display:inline;" class="gwt-TreeItem"> 
       <table> 
        ... 
       </table> 
     </div> 
    </div> 
    <div ...> 
    </div> 
    ... 
</div>

मेरा प्रश्न है: मैं व्यक्तिगत पेड़ पंक्तियों की गद्दी कैसे बदलना चाहिए? मुझे लगता है कि मैं .gwt-Tree > div के लिए सीएसएस नियमों की स्थापना के साथ कुछ कर सकता हूं लेकिन यह हैकी लगता है। क्या कोई और सुरुचिपूर्ण तरीका है?

समाधान: जाहिर है वहाँ एक और अधिक सुरुचिपूर्ण तरीका नहीं है।

.gwt-Tree > div:first-child { 
     width: 0px !important; 
     height: 0px !important; 
     margin: 0px !important; 
     padding: 0px !important; 
} 

.gwt-Tree > div { 
     padding: 0px 5px !important; 
} 

.gwt-Tree > div[hidefocus=true] { 
     width: 0px !important; 
     height: 0px !important; 

     margin: 0px !important; 
     padding: 0px !important; 
}

स्रोत

2010-03-22 Epaga

आप इस तरह यह कर सकता है:: यहाँ हम क्या किया, FWIW है

<html xmlns="http://www.w3.org/1999/xhtml"> 
<head> 
    <title>Test</title> 
    <style type="text/css"> 
    .gwt-Tree {background:green;} 
    .gwt-Tree div {padding-top: 3px; padding-right: 3px;padding-bottom: 3px; margin-left: 0px;padding-left: 23px;background:gray;} 
    .gwt-Tree div .gwt-TreeItem {padding:0;margin:0;background:red;color:#fff;} 
    </style> 
</head> 
<body> 
<div class="gwt-Tree"> 
    <div> 
     <div class="gwt-TreeItem"> 
      random 
     </div> 
    </div> 
    <div> 
     <div class="gwt-TreeItem"> 
      random 
     </div> 
    </div> 
</div> 
</body> 
</html>

ध्यान दें कि .gwt-ट्री div सब बच्चे divs को प्रभावित करेगा, ताकि आप उन्हें वापस करने के लिए पुनर्स्थापित करने के लिए है जिस शैली को आप चाहते हैं .gwt-Tree div .gwtTreeItem।

"हैकी>" के बारे में आपने कहा -> चयनकर्ता आईई 6 को छोड़कर सभी ब्राउज़रों में समर्थित है जो इसे पहचान नहीं पाएगा।

स्रोत

2010-03-22 13:38:45 easwee

खेद है कि मैं कि नहीं लगता कि मैं क्या कर रहा हूँ है ढूंढ रहे हैं: जो मुझे पहले या तीसरे स्तर के div के सीएसएस को कस्टमाइज़ करने की इजाजत देता है, लेकिन दूसरे स्तर के div नहीं, पैडिंग वाला एक ... – Epaga

आह क्षमा करें - मैंने आपके प्रश्न - संपादित उत्तर को गलत समझा। – easwee

मैंने जीडब्ल्यूटी Tree Documentation पर एक नज़र डाली। पेड़ और पेड़ मदों के लिए सीएसएस शैली नियमों

सीएसएस शैली नियम हैं

.gwt-ट्री
पेड़ ही

.gwt-ट्री .gwt-TreeItem
एक पेड़ आइटम

.gwt-ट्री .gwt-TreeItem चयनित
एक चयनित ट्री आइटम

आप शायद .gwt-ट्री .gwt-TreeItem करने और .gwt-ट्री को गद्दी जोड़ना चाहते हैं। gwt-TreeItem- चयनित

स्रोत

2010-03-22 14:46:49 Carnell

प्रश्न TreeItem div के बारे में नहीं था, लेकिन पेड़ और वृक्ष के बीच div। – gamma

@gamma ... पेज जो मैं ट्रीइटम और वृक्ष की सूची के संदर्भ में संदर्भित करता हूं। तो TreeItem के लिए div/css नाम वहां सूचीबद्ध है। यह मेरे उत्तर के पाठ में भी सूचीबद्ध है। मतदान से पहले पूरे डॉक्टर को पढ़ें। – Carnell

@ कार्नेल दुर्भाग्य से गामा सही है हालांकि: यदि आप मेरा प्रश्न देखते हैं, तो आप तीन स्तर देखेंगे: पेड़ (gwt-tree), दूसरा स्तर जो पैडिंग के साथ बदलना चाहता है, और वृक्षारोपण (gwt-treeitem) । और सवाल यह है कि वृक्ष को शामिल करने वाले div को स्टाइल करने के बारे में सवाल है। – Epaga

मुझे एक ही समस्या थी और सीएसएस के साथ इसे हल करने के साथ-साथ कोई भाग्य भी नहीं था।

/** 
    * handle top and bottom padding issue of leafs the grandparent DOM element (div) has disturbing top and bottom 
    * padding of 3px, which is changed here to 0px 
    * 
    * @param uiObject 
    *   uiObject which is a leaf in the tree 
    */ 
    private static void correctStyle(final UIObject uiObject) { 
     if (uiObject instanceof TreeItem) { 
     if (uiObject != null && uiObject.getElement() != null) { 
      Element element = uiObject.getElement(); 
      element.getStyle().setPaddingBottom(0, Unit.PX); 
      element.getStyle().setPaddingTop(0, Unit.PX); 
     } 
     } else { 
     if (uiObject != null && uiObject.getElement() != null && uiObject.getElement().getParentElement() != null 
       && uiObject.getElement().getParentElement().getParentElement() != null 
       && uiObject.getElement().getParentElement().getParentElement().getStyle() != null) { 
      Element element = uiObject.getElement().getParentElement().getParentElement(); 
      element.getStyle().setPaddingBottom(0, Unit.PX); 
      element.getStyle().setPaddingTop(0, Unit.PX); 
     } 
     } 
    }

मैं कोड में इस तरह विधि का उपयोग करें: अंत में मैं जावा कोड में ऊपर और नीचे गद्दी को बदलने में कामयाब रहे

Anchor fileDownloadLink = new Anchor(); 
fileDownloadLink.setStyleName(ViewConstants.STYLE_LINK_FILE_DOWNLOAD); 
fileDownloadLink.setText(subSubStructure.getName()); 
fileDownloadLink.setHref(ViewConstants.HREF_DOWNLOAD_FILE_EXTRACTED_DATA + subSubStructure.getPath()); 
treeItem.addItem(fileDownloadLink); 
StyleCorrector.correctStyle(fileDownloadLink);

स्रोत

2011-07-08 11:52:29 chux

जीडब्ल्यूटी: वृक्ष पंक्तियों का पैडिंग बदलें?

उत्तर

संबंधित मुद्दे